引导中的流体网格系统

Question

我目前正在阅读有关Bootstrap的书，出版物O'REILLY

似乎嵌套一个流体网格有点不同：由于我们使用百分比，因此每一行会将列数重置为12。例如，如果您在Span8 ，而不是两个span4元素将内容分为两半，则可以使用两个span6 divs （请参见流体网格系统| 5图1-4）。

响应式内容就是这种情况，因为我们希望内容填充容器的100％：

<div class="row-fluid">

    <div class="span8">
        level 1 of column
        <div class="row">
            <div class="span6">
                Level 2
            </div>
            <div class="span6">
                Level 2
            </div>
        </div>
    </div>
</div>

我的问题是 ，为什么我们不应该满足于使用span6两个span4来填充100％的容器？

Answer 1

由于网格跨度宽度是根据整个网格宽度计算的，而不是所讨论元素的父跨度。

想象一下您有3或4级嵌套的情况。 宽度计算将变得非常复杂。 通过使所有内容都相对于网格的外部结构，可视化和CSS本身都得以简化。