官方介绍:
Bootstrap 包含了一个响应式的、移动设备优先的、不固定的网格系统,可以随着设备或视口大小的增加而适当地扩展到 12 列。它包含了用于简单的布局选项的预定义类,也包含了用于生成更多语义布局的功能强大的混合类。
基本的网格结构如下。其中 * 可以为xs、sm、md、lg,每一个row对应将页面的一行划分为12列。如col-sm-2,表示占据一行的2列。同样 col-md-2也是占据一行的2列。不同是xs适用于手机屏幕,sm适用于平板屏幕,md适用于电脑屏幕,而lg则是大屏幕。这些class是可以重叠适用的,在不同的屏幕适用过程中,会自动适配相应规格的class。
<div class="container"> <div class="row"> <div class="col-*-*"></div> <div class="col-*-*"></div> </div> <div class="row">...</div> </div> <div class="container">....
偏移列:
对于不想默守陈规的表格式填充页面,可以用偏移列,让元素居中等其他显示效果。其中 * 从1到11
.col-md-offset-*