Bootstrap 网格 - 大型设备

Bootstrap 网格示例：大型设备

在上一章中，我们展示了一个包含小型和中型设备类的网格示例。我们使用了两个 div（列），并在小型设备上给它们分配了 25%/75% 的分割，而在中型设备上分配了 50%/50% 的分割。

但是，在大型设备上，设计可能更适合 33%/66% 的分割。

提示： 大型设备定义为屏幕宽度从1200 像素及以上。

对于大型设备，我们将使用 .col-lg-* 类。

现在，我们将添加大型设备的列宽度。

现在，Bootstrap 将会说“在小型尺寸下，查看包含 -sm- 的类并使用它们。在中型尺寸下，查看包含 -md- 的类并使用它们。在大型尺寸下，查看包含 -lg- 的类并使用它们”。

以下示例将在小型设备上产生 25%/75% 的分割，在中型设备上产生 50%/50% 的分割，在大型设备上产生 33%/66% 的分割。

仅使用大型

在下面的示例中，我们只指定了 .col-lg-6 类（不包含 .col-md-* 和/或 .col-sm-*）。这意味着大型设备将进行 50%/50% 的分割。但是，对于中型和小型设备，它将垂直堆叠（100% 宽度）。