Bootstrap 3网格化

Question

我试图找出bootstrap 3中的新网格系统（我一般都是Bootstrap的新手）。

在bootstrap tutorial中，他们声明网格有12个单位，但.col-xs的总和通常达到18，而其他人达到12。

我无法弄清楚原因。

Answer 1

正如您在grid options中所看到的，网格总是有12列可用于任何屏幕尺寸。请记住，您可以在一个div上拥有多个列类，例如：

<div class="col-xs-12 col-md-8">stuff</div>

这将使这个div 12列在超小型设备上，8列宽在中等。

编辑：

我认为这个例子可能就是你所指的（here's its fiddle）：

<div class="row">
  <div id="a" class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
  <div id="b" class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

对于超小屏幕，这将使第一列宽度保持为12，第二列将突出显示到下一行（宽度为6列）。但是，在小屏幕上，第一列为6宽，第二列为6宽。