Bootstrap学习笔记系列7-----Bootstrap简单背景CSS及其他辅助类
背景
通过添加下列类,可以快捷的变换背景颜色,如果是链接的话,鼠标移动上去会变暗
bg-primary
被修饰元素将会应到primary类,显示吃淡蓝色,文本颜色会变成白色。bg-success
被修饰元素表示成功的信息,背景变成绿色bg-info
被修饰元素背景颜色会变成淡蓝色bg-warining
被修饰元素表示值得注意的信息,背景颜色变成土黄色bg-danger
被修饰元素表示危险的信息,背景颜色会变成红色
其他
浮动
pull-left
元素浮动到左边pull-right
元素浮动到右边内容居中
center-block
设置元素为display:block并居中显示清除浮动
clearfix
清除浮动显示和隐藏内容
show
显示元素(包括屏幕阅读器)hidden
隐藏元素(包括屏幕阅读器)屏幕阅读器
sr-only
让元素对所有设备隐藏,除了屏幕阅读器sr-only-focusable
在元素获得焦点的时候显示样式
close
会产生通用的关闭图标caret
显示出通用的下拉框
Bootstrap学习笔记系列7-----Bootstrap简单背景CSS及其他辅助类的更多相关文章
- Bootstrap学习笔记系列3-------Bootstrap简单表单显示
表单布局 垂直或基本表单 基本的表单结构时BootStrap自带的,创建基本表单的步骤如下: 向父<form>元素添加role = "form": 为了获取最佳的间距, ...
- Bootstrap学习笔记系列1-------Bootstrap网格系统
Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...
- bootstrap学习笔记系列4------bootstrap按钮
按钮标签 在<a>,<button>或input元素上使用按钮class.但是为了避免跨浏览器的不一致性,建议使用<button>标签. <!DOCTYPE ...
- bootstrap学习笔记<一>(bootstrap用法)
首先引入bootstrap官网链接:http://www.bootcss.com/ bootstrap 3下载地址:http://v3.bootcss.com/getting-started/#dow ...
- Bootstrap学习笔记系列2-------Bootstrap简单表格处理
标签 <table> 为表格添加基础样式 <thead> 表格标题行的容器元素,用来识别列 <tbody> 表格主提中的表格行的容器元素 <tr> 单行 ...
- Bootstrap学习笔记系列5------Bootstrap图片显示
通过添加一下的class来实现bootstrap对图片的支持 img-round 通过border-radius:6px 来获得图片圆角 img-circle 通过border-radius:50%来 ...
- Bootstrap学习笔记系列6-----Bootstrap文本显示
通过对文本或者链接添加下面的类,会使其展示不同的颜色,如果文本是个链接,鼠标移动到文本上,颜色会变暗. text-muted柔和的文本(深色) text-primary 表示基础的文本(蓝色) tex ...
- bootstrap学习笔记<八>(bootstrap核心布局风格——栅格系统)
栅格系统(bootstrap的核心之一,也是bootstrap的主要布局风格) 栅格系统是对原有div布局的升级版.打破了传统div模式只能纵向垂直排列的弊端,大大提高了页面布局的速度和效果,也很好的 ...
- Bootstrap学习笔记(二) 表单
在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...
随机推荐
- python 实现web框架simfish
python 实现web框架simfish 本文主要记录本人利用python实现web框架simfish的过程.源码github地址:simfish WSGI HTTP Server wsgi模块提供 ...
- swagger:The World's Most Popular Framework for APIs.
swagger官网:http://swagger.io/ swagger ui demo:http://petstore.swagger.io 让API文档总是与API定义同步更新,是一件非常有价值的 ...
- 删除xcode 里的多余证书
删除xcode 里的多余证书 方法一: command+shift+G 前往文件夹: ~/Library/MobileDevice/Provisioning Profiles 方法二: 进入xcode ...
- Atititi 版本管理 rc final rtm ga release 软件的生命周期中一般分4个版本
Atititi 版本管理 rc final rtm ga release 软件的生命周期中一般分4个版本 RC=Release Candidate,含义是"发布候选版",它不是最终 ...
- Atitit 图像处理30大经典算法attilax总结
Atitit 图像处理30大经典算法attilax总结 1. 识别模糊图片算法2 2. 相似度识别算法(ahash,phash,dhash)2 3. 分辨率太小图片2 4. 横条薯条广告2 5. 图像 ...
- Git Sophisticated Commands
Compare two branches: branch_1 and branch_2: git diff branch_1…branch_2 Merge specified files of one ...
- select元素javascript常用操作 转
/*------------------------------------------------------ *作者:xieyu @ 2007-08-14 *语言:JavaScript *说明:s ...
- OpenCascade Primitives BRep - Box
OpenCascade Primitives BRep - Box eryar@163.com Abstract. BRep is short for Boundary Representation. ...
- .NET面试题解析(00)-开篇来谈谈面试 & 系列文章索引
系列文章索引: .NET面试题解析(01)-值类型与引用类型 .NET面试题解析(02)-拆箱与装箱 .NET面试题解析(03)-string与字符操作 .NET面试题解析(04)-类型.方法与继承 ...
- WPF Bitmap转Imagesource
var imgsource = System.Windows.Interop.Imaging.CreateBitmapSourceFromHBitmap(bmp.GetHbitmap(),IntPtr ...