bootstrap 常用class汇总

img图像
img-responsive
容器
container

-------网格系统 ----------
栅格系统
/* 超小设备(手机,小于 768px) */
/* Bootstrap 中默认情况下没有媒体查询 */

/* 小型设备(平板电脑,768px 起) */
@media (min-width: @screen-sm-min) { ... }

/* 中型设备(台式电脑,992px 起) */
@media (min-width: @screen-md-min) { ... }

/* 大型设备(大台式电脑,1200px 起) */
@media (min-width: @screen-lg-min) { ... }

偏移列 .col-md-offset-* 列排序 .col-md-push-* .col-md-pull-* -----------排版---------------- .small 字号更小的颜色更浅的文本 .lead 更大更粗、行高更高的文本 .text-muted: 提示,使用浅灰色(#999) .text-primary: 主要,使用蓝色(#428bca) .text-success: 成功,使用浅绿色(#3c763d) .text-info: 通知信息,使用浅蓝色(#31708f) .text-warning: 警告,使用黄色(#8a6d3b) .text-danger: 危险,使用褐色(##a94442) .text-left 向左对齐文本 .text-center 居中对齐文本 .text-right 向右对齐文本 .text-justify 设定文本对齐,段落中超出屏幕部分文字自动换行 .text-nowrap 段落中超出屏幕部分不换行 .text-lowercase 设定文本小写 .text-uppercase 设定文本大写 .text-capitalize 设定单词首字母大写 .initialism 显示在 元素中的文本以小号字体展示 .blockquote-reverse 设定引用右对齐 .list-unstyled 移除默认的列表样式,列表项中左对齐 (
      中)。 这个类仅适用于直接子列表项 (如果需要移除嵌套的列表项,你需要在嵌套的列表中使用该样式) .list-inline 将所有列表项放置同一行 .dl-horizontal 该类设置了浮动和偏移,应用于
      元素和
      元素中,具体实现可以查看实例 .pre-scrollable 使
       元素可滚动 scrollable
                         文本底部的一条虚线边框
      
      显示联系信息
      这是一个带有源标题的引用 -----------表格-------------- 表格类 .table 为任意 添加基本样式 (只有横向分隔线) .table-striped 在 内添加斑马线形式的条纹 ( IE8 不支持) .table-bordered 为所有表格的单元格添加边框 .table-hover 在 内的任一行启用鼠标悬停状态 .table-condensed 让表格更加紧凑 .table-responsive 让表格水平滚动以适应小型设备(小于 768px) ,
      类 .active 将悬停的颜色应用在行或者单元格上 .success 表示成功的操作 .info 表示信息变化的操作 .warning 表示一个警告的操作 .danger 表示一个危险的操作 ----------表单----------------- 一.垂直或基本表单 1.向父
      元素添加 role="form"。 2.把标签和控件放在一个带有 class .form-group 的
      中。这是获取最佳间距所必需的。 3.向所有的文本元素