Bootstrap中常用の类名记录

布局容器

1. .container 类用于固定宽度并支持响应式布局的容器。
2. .container-fluid 类用于 100% 宽度，占据全部视口（viewport）的容器。
   注:由于 padding 等属性的原因，这两种容器类不能互相嵌套

栅格系统

1. .col-xs- 超小屏幕 手机 (<768px)
2. .col-sm- 小屏幕 平板 (≥768px)
3. .col-md- 中等屏幕 桌面显示器 (≥992px)
4. .col-lg- 大屏幕 大桌面显示器 (≥1200px)
   注:每一个列的每边分别 15px,共30px
5. .row 所有“列（column）必须放在 ” .row 内

列偏移

.col-*-offset-*列偏移,第一个*是xs,sm,md,lg中的一个,第二个*是偏移量,范围0-12

列排序

1. .col-md-push-* 向右边推几个单位,其中*范围是从 1 到 11。
2. .col-md-pull-* 向左边推几个单位,其中*范围是从 1 到 11。

排版

1. .h1到.h6 效果和<h1>到 <h6>相同,为的是给内联（inline）属性的文本赋予标题的样式。
2. .small 效果和<small>相同,可以用来标记副标题
3. .lead 给段落添加强调文本,这将得到更大更粗、行高更高的文本

对齐

1. .text-left 向左对齐文本
2. .text-center 居中对齐文本
3. .text-right 向右对齐文本
4. .text-justify 两端对齐文本
5. .text-nowrap 不换行文本

改变大小写

1. .text-lowercase 全部小写
2. .text-uppercase 全部大写
3. .text-capitalize 首字母大写

图片

1. .img-responsive 使图片支持响应式布局
2. .center-block 让使用了 .img-responsive 类的图片水平居中
3. .img-rounded 圆角图片
4. .img-circle 圆图
5. .img-thumbnail缩略图

辅助类

情境文本颜色

.text-? 后面可以拼接muted,primary,success等

情境背景色

bg-?后面可以拼接primary,success等

关闭按钮

.close象征关闭的图标

三角符号

.caret

清除浮动

.clearfix

显示与隐藏

.show显示
.hidden隐藏

响应式工具

只在某一端显示

.visible-*-*第一个*是xs,sm,md,lg中的一个,第二个*是block,inline,inline-block中的一个

只在某一端隐藏

.hidden-* *是xs,sm,md,lg中的一个