Twitter引导程序 - 嵌套行与多行

Question

我开始使用Twitter bootstrap来处理我正在处理的这个应用程序.

我阅读了有关在固定网格系统和流体系统中嵌套行的文档.

现在,我想做这样的事情

所以我当然可以这样做

<div class="container">
    <div class="row">
        <div class="span 12">red</div>
        <div class="row">
            <div class="span 3">yellow</div>
            <div class="span 9">green</div>
        </div>
    </div>
</div>

我想我会得到我想要的东西.但我想知道做的后果是什么

<div class="container">
    <div class="row">
        <div class="span 12">red</div>
    </div>
    <div class="row">
        <div class="span 3">yellow</div>
        <div class="span 9">green</div>
    </div>
</div>

我现在在浏览器中看不出任何差异,但我想知道如果我在单个container标签中包含多个行元素会发生什么.行嵌套是创建像我展示的东西的唯一正确方法吗？可以这么说,我设计的这两种实现有什么区别？

Answer 1

第二个版本更正确.但两者都有效.不同之处在于它在重新调整页面大小时的响应方式.第二个版本将缩小并做出更好的反应

但是,如果您希望容器与上面的图像匹配,则需要使用class="container-fluid"和class="row-fluid"

同时删除跨距和数字之间的空格

class="span 3"

应该说

class="span3"