一排排液可以吗？

Question

我一直在玩Twitter Bootstrap grid system，并注意到我可以通过以下方式混合row和row-fluid：

<div class="row">
    <div class="span8">
        ...
    </div>

    <div class="span4>
        <div class="row-fluid">
            <div class="span8">
                ...
            </div>
            <div class="span4">
                ...
            </div>
        </div>
    </div>
</div>

这对我有用，但是我不确定我是否可以依靠这种行为来保持一致。如果发现有关此主题的文档不清楚。

这是一个记录在案的，可靠的网格系统吗？或者我应该只在另一个row-fluid内使用row-fluid吗？

Answer 1

.row-fluid的主要目的是改变.spanX元素的样式。

在.row内，.spanX元素具有固定的像素宽度。如果您正在使用自适应样式表，则此宽度可能会根据视口尺寸发生变化。

在.row-fluid内，.spanX元素的宽度为百分比。这里一个很好的副作用是.row-fluid元素可以放在任何元素中，它只是将自身大小调整为容器宽度的100％。同样，此流体行中的任何.spanX元素都会相应地调整自身大小，以便每个列都可以使用“.row-fluid列。无论行中的行的宽度或位置如何，.row-fluid容器大约是第12个（占装订线宽度）。

如果您要将网页的任何区域拆分为若干设定数量的列，则可以使用{{1}}。

Answer 2

是的，它可靠并且有文件证明。请查看文档中的Basic fluid grid HTML部分。正如您将看到的那样：

  

通过将.row更改为.row-fluid使任何行“流畅”。列类保持完全相同，可以在固定网格和流体网格之间轻松切换。

这意味着您可以在布局中的任何位置使用此组件，无论它是否流畅都无关紧要。您还会注意到“流体布局”部分与此部分完全分开。

Answer 3

是的，你可以用这种方式使用行和行液。如果您正在使用bootstrap-responsive.css，那么当浏览器重新调整大小或在移动设备上查看页面时，网格大小会被更改为适合。