网格选项
下表总结了 Foundation 网格系统在多个设备上的说明:
小型设备
Phones (<40.0625em (640px)) 中等设备 Tablets (>=40.0625em (640px)) 大设备
Laptops & Desktops (>=64.0625em (1025px))
网格行为 一直是水平的 以折叠开始,断点以上是水平的 以折叠开始,断点以上是水平的
类前缀 .small- .medium- .large-*
类的数量 12 12 12
可内嵌 Yes Yes Yes
偏移量 Yes Yes Yes
列排序 Yes Yes Yes
宽屏
网格最大(.row) 宽度为 62.5rem。在宽屏上,当宽度大于 62.5rem, 列不会跨越页面的宽度, 即使宽度设定为 100%。但你可以通过 CSS 重新设置 max-width:
实例
尝试一下 »
如果你使用默认的 max-width, 但希望背景颜色跨越整个页面宽度,你可以使用 .row 包裹整个容器,并指定你需要的背景颜色:
实例
.small-6
.small-6