Question

基于Bootstarp Gridview，列的总和必须等于12才能正确对齐和显示。

查看下面的代码， col-xs-6 总计为18，但这显示正确对齐。

<div class="row">
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

我希望有人向我解释这一点。

注意：对我来说，这可以设置为：

 <div class="row">
  <div class="col-xs-4 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-4 col-md-4">.col-xs-6 .col-md-4</div>
  <div class="col-xs-4 col-md-4">.col-xs-6 .col-md-4</div>
</div>

Answer 1

这是一个常见的误解，列必须等于12.使用超过12个没有错，实际上Bootstrap文档声明：

“如果在一行中放置超过12列，则每组都有额外的列将作为一个单元包裹到一个新的行“

文档中还有一些示例说明了为什么必要的“列包装”：http://getbootstrap.com/css/#grid-example-wrapping

Read this article。唯一一次你不希望超过12个单位是嵌套列。

Answer 2

因为您的屏幕尺寸不在XS范围内，并且浏览器正在渲染＆＃34; col-md-4＆＃34;

屏幕尺寸小于992px（宽度）

Answer 3

这是新编码员的常见误解。总和可以超过12：）

Bootstrap Gridview对齐混合

3 个答案: