看如何在多个设备上使用一个方便的表,引导网格系统工作的方面。
超小型装置 Phones (<768px) | 小装置 Tablets (≥768px) | 中等设备 Desktops (≥992px) | 大型设备 Desktops (≥1200px) | |
---|---|---|---|---|
网格行为 | 水平在任何时候 | 崩溃的开始,水平以上的断点 | ||
最大网格宽度 | None (auto) | 750px | 970px | 1170px |
样式类前缀 |
.col-xs-
|
.col-sm-
|
.col-md-
|
.col-lg-
|
# 列 | 12 | |||
最大单元格宽 | Auto | 60px | 78px | 95px |
网格线宽 | 30px (15px on each side of a column) | |||
嵌套 | Yes | |||
偏移 | Yes | |||
列排序 | Yes |
网格类适用于具有屏幕宽度大于或等于断点大小的设备,并覆盖在较小的设备上的网格类。因此,应用任何
.col-md-
类到一个元素将不仅影响其造型在中等设备,但也对大型设备,如果
.col-lg-
类不存在。
有了四层网格,你必然会遇到一些问题,在某些地方,你的专栏并不清楚,因为一个比另一个更高。要解决这个问题,使用一个组合
.clearfix
我们的响应实用类.