html - 为什么 Bootstrap 最多只能有 12 列的类？为什么不多呢？

Question

为什么我限制为 12 列？为什么不默认更多，以获得更大的灵 active ？

让我解释一下让我感到困惑的地方。假设我想创建一个带有左侧菜单和右侧内容的简单页面。

<div class="col-sm-3">Left menu</div> <!-- 258px -->
<div class="col-sm-9">Content</div> <!-- 772px -->

<div class="col-sm-4">Left menu</div> <!-- 343px -->
<div class="col-sm-8">Content</div> <!-- 687px -->

如上例所示，菜单的 sm-3 和 sm-4 之间的差异几乎为 100 像素!如果我希望菜单为 300px，我不能使用网格。如果我有更多的列，我可以比这更精确。

我是否以错误的方式使用网格系统？为什么网格分成这么少的列？

Answer 1

您可以使用 LESS 编辑列的数量。

12 是默认值，因为它是最多 12 的任何可能数字中最灵活的网格模式。

 COLUMNS   | EVEN COLUMNS POSSIBLE
 1 column  = 1 (1x1)
 2 columns = 2 (1x2, 2x1)
 3 columns = 2 (1x3, 3x1)
 4 columns = 2 (1x4, 2x2, 4x1)
 5 columns = 2 (1x5, 5x1)
 6 columns = 4 (1x6, 2x3, 3x2, 6x1)
 7 columns = 2 (1x7, 7x1)
 8 columns = 4 (1x8, 2x4, 4x2, 8x1)
 9 columns = 3 (1x9, 3x3 9x1)
10 columns = 4 (1x10, 2x5, 5x2, 10x1)
11 columns = 2 (1x11, 11x1)

12 columns = 6 (1x12, 2x6, 3x4, 4x3, 6x2, 12x1)