bootstrap初探_html/css

来源：铧拓汽车网

bootstrap资源
http://getbootstrap.com
http://github.com/twbs
http://www.bootcss.com
bootstrap栅格系统
容器：流体（container-fluid）、固定（container）
分12列，阈值分辨率>=1200,container固定尺寸为1170px，若阈值在992到1200之间container固定尺寸为970px，若分辨率在992以下778以上为750px，778px以下为自适应，没有固定的宽度值

   无标题文档     aaaaaaaaa

 1 2  3  4  5 无标题文档 6  7  8 9 13 14 15 16 17 col-lg-118 col-lg-119 20 21 22 23

不同分辨率下，设置col-lg表示超大分辨率，col-md是中等分辨率，col-sm是pad类似大小，col-xs是移动设备，如果设置了col-*那么会按照相应的分辨率显示，如果小于相应的分辨率则会变为几行，demo如下，可自行运行，以及对应demo图片

   无标题文档     col-lg-1 col-lg-1 col-lg-4 col-lg-4 col-lg-4 col-md-4 col-md-4 col-md-4 col-sm-4 col-sm-4 col-sm-4 col-xs-4 col-xs-4 col-xs-4

组合布局，可设置多个class，在分辨率为一个值得时候按照某个class显示，如果分辨率换成另外一个按照另外一个class显示，如下面demo所示，当分辨率大于1200时，按照col-lg显示四列，如果分辨率小于1200大于992，按照col-md显示三列

   无标题文档     col-lg-3 col-md-4 col-lg-3 col-md-4 col-lg-3 col-md-4 col-lg-3 col-md-4

   无标题文档     col-lg-3 col-lg-3 col-lg-3 col-lg-3 col-lg-4

最多偏移为12，若大于12则不起任何作用，demo以及代码运行效果如下

   无标题文档     col-lg-3 col-lg-3 col-lg-3 col-lg-3 col-lg-4 col-lg-offset-13

   无标题文档     col-lg-2 col-lg-10 col-lg-2 col-lg-10