使用 Bootstrap 网格系统为不同设备构建页面

网格系统用于通过一系列包含内容的行和列来创建页面布局。

以下是 Bootstrap 网格系统的工作原理

• 必须将行放在 .container 类中，以实现正确的对齐和填充。
• 使用行创建列的水平组。
• 内容应放在列中，并且只有列可以是行的直接子代。
• 预定义的网格类（例如 .row 和 .col-xs-4）可用于快速进行网格布局。也可以使用更少的组合来实现更有意义的布局。
• 列通过填充创建间隙（列内容之间的空白）。这些填充通过 .rows 上的负边距在第一列和最后一列上的行中进行偏移。
• 通过指定想要跨越的 12 个可用列的数量来创建网格列。例如，三个相等的列将使用三个 .col-xs-4。

Arjun Thakur

更新于: 12-06-2020

353 个浏览量

职业起步

完成课程获得认证

开始