背景

通过添加下列类，可以快捷的变换背景颜色，如果是链接的话，鼠标移动上去会变暗

  • 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及其他辅助类的更多相关文章

  1. Bootstrap学习笔记系列3-------Bootstrap简单表单显示

    表单布局 垂直或基本表单 基本的表单结构时BootStrap自带的,创建基本表单的步骤如下: 向父<form>元素添加role = "form": 为了获取最佳的间距, ...

  2. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  3. bootstrap学习笔记系列4------bootstrap按钮

    按钮标签 在<a>,<button>或input元素上使用按钮class.但是为了避免跨浏览器的不一致性,建议使用<button>标签. <!DOCTYPE ...

  4. bootstrap学习笔记<一>（bootstrap用法）

    首先引入bootstrap官网链接:http://www.bootcss.com/ bootstrap 3下载地址:http://v3.bootcss.com/getting-started/#dow ...

  5. Bootstrap学习笔记系列2-------Bootstrap简单表格处理

    标签 <table> 为表格添加基础样式 <thead> 表格标题行的容器元素,用来识别列 <tbody> 表格主提中的表格行的容器元素 <tr> 单行 ...

  6. Bootstrap学习笔记系列5------Bootstrap图片显示

    通过添加一下的class来实现bootstrap对图片的支持 img-round 通过border-radius:6px 来获得图片圆角 img-circle 通过border-radius:50%来 ...

  7. Bootstrap学习笔记系列6-----Bootstrap文本显示

    通过对文本或者链接添加下面的类,会使其展示不同的颜色,如果文本是个链接,鼠标移动到文本上,颜色会变暗. text-muted柔和的文本(深色) text-primary 表示基础的文本(蓝色) tex ...

  8. bootstrap学习笔记<八>（bootstrap核心布局风格——栅格系统）

    栅格系统(bootstrap的核心之一,也是bootstrap的主要布局风格) 栅格系统是对原有div布局的升级版.打破了传统div模式只能纵向垂直排列的弊端,大大提高了页面布局的速度和效果,也很好的 ...

  9. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

随机推荐

  1. merge sort and quick sort 自己去理解吧

    <?php $digits=array(,,,,,,,); function quickSort($arr){ $len=count($arr); ){ return $arr; } $midK ...

  2. 关于QCon2015感想与反思

    QCon2015专场有不少关于架构优化.专项领域调优专题,但能系统性描述产品测试方向只有<携程无线App自动化测试实践>.   (一). 携程的无线App自动化     <携程无线A ...

  3. ejs模板中的四种表达式输出形式

    在ejs模板中,通常会用下面四种方式在HTML中输出服务端的变量或表达式的值: 1. 直接在<%%>中写表达式或变量.这种情况通常只是用来进行表达式计算或给变量赋值,不会有任何输出,被称作 ...

  4. 02- Shell脚本学习--运算符

    Shell运算符 Bash 支持很多运算符,包括算数运算符.关系运算符.布尔运算符.字符串运算符和文件测试运算符. 算术运算符 原生bash不支持简单的数学运算,但是可以通过其他命令来实现,例如 aw ...

  5. 状态栏 a.getBoolean(1, false) 报错

    状态栏 a.getBoolean(1, false) 报错 这个错误在编译运行时候并不会出现,但是当需要编译打包的时候,就会报出这个异常. TypedArray a = mContext.obtain ...

  6. atitit 英文与中文与阿拉伯文的简化解决方案.docx

    atitit 英文与中文与阿拉伯文的简化解决方案.docx 1. 英文与中文与阿拉伯文的简化意义1 2. 简化的主要方法分类2 2.1. 同音替代法(比如o2o)2 2.2. 符号法(比如英文i18n ...

  7. iOS ---Swift学习与复习

    swift中文网 http://www.swiftv.cn http://swifter.tips/ http://objccn.io/ http://www.swiftmi.com/code4swi ...

  8. iOS----关于第三方的运用（有待补充）

    第三方东西涵盖哪些内容? 1)第三方SDK 2)第三方框架 3)第三方功能代码的封装开源分享 4)第三方工具类等等 PS:1. 对于一个在正在深入学习的程序员而言,有时候参考学习或者使用一下第三方的东 ...

  9. 使用Connetion的属性RetainSameConnection

    在SSIS的组件中,很多都会连接到数据库进行操作,Connection有一个属性RetainSameConnection,默认值是False,控制着连接的打开和关闭的时机. 1,如果Connectio ...

  10. mysqldump导出不包含存储过程

    mysqldump导出不包含存储过程 mysqldump -u 数据库用户名 -p -n -t -d -R --triggers=false 数据库名 > 文件名 这样单独把存储过程和函数导出 ...