背景

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

  • 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. Java序列化格式详解

    RPC的世界,由于涉及到进程间网络远程通信,不可避免的需要将信息序列化后在网络间传送,序列化有两大流派: 文本和二进制. 文本序列化 序列化的实现有很多方式,在异构系统中最常用的就是定义成人类可读的文 ...

  2. netstat 1

    lsof -i   :8086 第二个参数需要:开头 netstat linux  -a (all)显示所有选项,默认不显示LISTEN相关 理解这个很关键, 这是为什么我们netstat -a 不显 ...

  3. JavaScript语法、对话框。分支语句

    一.用法 其所在的位置有三块,1.head里面  2.body里面  3.</html>后   一般都写在</html>后 其用法为<script></scr ...

  4. 什么是P3O？

    P3O(Portfolio, Programme and Project Offices)项目组合.项目群和项目办公室资格认证. 是由英国商务部 OGC 于2008年10月28日发布的最新的最佳实践指 ...

  5. paip.java gui swt/jface 最佳实践

    paip.java gui swt/jface 最佳实践 1. 工具:Eclipse +jigloo4 1 2. 安装插件: 1 1. IMPORT swt lib 2 2. 新建立窗体 2 3. 运 ...

  6. 遍历后台的List，让前台的多选宽被选中

    后端代码: /** * 获取优惠卷分页信息 * * * @param ph * 包括查询条件以及分页查询条件 * */ @Override public DataGrid<AppCmsCoupo ...

  7. C#与JS实现 获取指定字节长度 中英文混合字符串 的方法

    平时在作数据库插入操作时,如果用 INSERT 语句向一个varchar型字段插入内容时,有时会因为插入的内容长度超出规定的长度而报错. 尤其是插入中英文混合字符串时,SQL Server中一般中文要 ...

  8. file:///Users/xmg/Desktop/xiangmu~Bsbdejie/BaisibudejieTheSecondtime/BaisibudejieTheSecond/BaisibudejieTheSecond/AppDelegate.m: warning: Missing file: /Users/xmg/Desktop/xiangmu~Bsbdejie/BaisibudejieT

    warning: Missing file: is missing from working copy fatal error: file '-.h' has been modified since ...

  9. 关于js中值的比较规则问题

    上一篇文章提到了javascript中可变值与不可变值,如果你不知道什么是可变值和不可变值,可以先去看看那篇文章,再回来看这篇,因为这篇文章是基于可变值与不可变值讲解的. 那我就默认你知道什么是可变值 ...

  10. 【原创】.NET读写Excel工具Spire.Xls使用(1)入门介绍

    在.NET平台,操作Excel文件是一个非常常用的需求,目前比较常规的方法有以下几种: 1.Office Com组件的方式:这个方式非常累人,微软的东西总是这么的复杂,使用起来可能非常不便,需要安装E ...