Bootstrap栅格化布局

  超小设备手机(<768px) 小型设备平板电脑(≥768px) 中型设备台式电脑(≥992px) 大型设备台式电脑(≥1200px)
网格行为 一直是水平的 以折叠开始,断点以上是水平的 以折叠开始,断点以上是水平的 以折叠开始,断点以上是水平的
最大容器宽度 None (auto) 750px 970px 1170px
Class 前缀 .col-xs-  .col-sm- .col-md- .col-lg-
列数量和 12 12 12 12
最大列宽 Auto  60px  78px  95px
间隙宽度 30px(一列的每边分别 15px) 30px(一列的每边分别 15px) 30px(一列的每边分别 15px) 30px(一列的每边分别 15px)

 

1、偏移列

 

偏移可用来给列腾出更多的空间。

 

.col-xs-* 类不支持偏移,但是可以简单地通过使用一个空的单元格来实现该效果。

 

为了在大屏幕显示器上使用偏移,请使用 .col-md-offset-* 类,这些类会把一个列的左外边距margin增加 * 列,其中 *范围是从 1 到 11。

 

例如:<div class="col-md-6 col-md-offset-3">...</div>可居中div。

 

 

2、嵌套列

 

为了在内容中嵌套默认的网格,在一个已有的 .col-md-* 列内添加添加一个新的 .row,并在新的 .row内添加一组 .col-md-* 列,这组列个数不能超过12,其实,也没有要求必须占满12列。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.duanlonglong.com/qdjy/414.html