一，关于图标：
1.字体图标
2.文件格式图标
二，移动端优先：
Bootstrap 排版、链接样式设置了基本的全局样式。分别是：
1.为 body 元素设置 background-color: #fff;
2.使用 @font-family-base、@font-size-base 和 @line-height-base 变量作为排版的基本参数
3.为所有链接设置了基本颜色 @link-color ，并且当链接处于 :hover 状态时才添加下划线
这些样式都能在 scaffolding.less 文件中找到对应的源码。
三，bootstrap的版本：
1. v1.x
1.40 , 1.30 , 1.2.0 ,1.1.1, 1.1.0, 1.0.0
2. v2.x
2.0.0 - 2.3.2等等
3. v3.x
3.4 , 3.3
4. v4.x
4.0 , 4.1, 4.2, 4.3 , 4.4, 4.5 等等
四，布局容器
Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意，由于 padding 等属性的原因，这两种 容器类不能互相嵌套。
.container 类用于固定宽度并支持响应式布局的容器。
<div class="container">
...
</div>
.container-fluid 类用于 100% 宽度，占据全部视口（viewport）的容器。
<div class="container-fluid">
...
</div>
五，媒体查询
在栅格系统中，我们在 Less 文件中使用以下媒体查询（media query）来创建关键的分界点阈值。
/* 超小屏幕（手机，小于 768px） */
/* 没有任何媒体查询相关的代码，因为这在 Bootstrap 中是默认的（还记得 Bootstrap 是移动设备优先的吗？） */
/* 小屏幕（平板，大于等于 768px） */
@media (min-width: @screen-sm-min) { ... }
/* 中等屏幕（桌面显示器，大于等于 992px） */
@media (min-width: @screen-md-min) { ... }
/* 大屏幕（大桌面显示器，大于等于 1200px） */
@media (min-width: @screen-lg-min) { ... }
我们偶尔也会在媒体查询代码中包含 max-width 从而将 CSS 的影响限制在更小范围的屏幕大小之内。
@media (max-width: @screen-xs-max) { ... }
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }
@media (min-width: @screen-lg-min) { ... }
六，栅格参数
通过下表可以详细查看 Bootstrap 的栅格系统是如何在多种屏幕设备上工作的。
超小屏幕
手机 (<768px)
小屏幕
平板 (≥768px)
中等屏幕
桌面显示器 (≥992px)
大屏幕
大桌面显示器 (≥1200px)
栅格系统行为
总是水平排列
开始是堆叠在一起的，当大于这些阈值时将变为水平排列C
.container 最大宽度
None （自动）
750px
970px
1170px
类前缀
.col-xs-
.col-sm-
.col-md-
.col-lg-
列（column）数
12
最大列（column）宽
自动
~62px
~81px
~97px
槽（gutter）宽
30px （每列左右均有 15px）
可嵌套
是
偏移（Offsets）
是
列排序
是
七，流式布局容器
将最外面的布局元素 .container 修改为 .container-fluid，就可以将固定宽度的栅格布局转换为 100% 宽度的布局。
<div class="container-fluid">
<div class="row">
...
</div>
</div>
