Question

我已经阅读了.container和.container-fluid的几个SO答案，但我缺少的很简单。如果我使用.container-fluid，我是否使用col-xs-6，col-md-9等列类？调整大小和.container都是特定的大小，这就是我使用col-xx类的原因，但是.container-fluid一直调整所有内容的大小.container-fluid自动处理列大小调整，我“信任”它做对了吗？

Answer 1

container-fluid用于contain the grid（row + col-*），但也可用于其他内容，例如标题，表格等。

所以不，container-fluid不是列的替代品，它是列的持有者。 container-fluid和container之间的唯一区别是较大屏幕上container 不全宽。 container是一个固定的宽度，以两侧的大边距为中心。 container-fluid没有调整大小，它总是100％宽度。 Container demo

如果你想使用响应式网格（行和列），你需要像这样使用容器或容器流体。

<div class="container-fluid">
    <div class="row">
        (one or more col-*-* here)
    </div>
</div>

或的

<div class="container">
    <div class="row">
        (one or more col-*-* here)
    </div>
</div>

阅读this article以获取完整说明。

Answer 2

容器主要存在于1）限制页面宽度和2）为行提供填充。流体容器只能用后者。如果您没有使用行，则可能不需要容器。但是，如果您正在使用列，则应使用行和容器来获得更好，更可控的结构。

Answer 3

是的，您可以，因为.container-fluid被用作container，但区别在于响应大小。

请参阅：Container-fluid vs .container

如果我在Bootstrap 3中使用.container-fluid，这是否意味着我需要使用网格类？

3 个答案: