Question

<div class="col-lg-9">
    <!-- Tab Content -->
    <div class="tab-content">
        <div class="tab-pane active" id="bookmark">
            <h1><center>Book Marks</center></h1>
            <div class="col-lg-3 productholder"></div>
            <div class="col-lg-3 productholder"></div>
            <div class="col-lg-3 productholder"></div>
        </div>
    </div>
</div>

如果我是col-lg-9的div，这会将我的容器分成9个部分？但是当我在col-lg-9中创建其他div时，容器没有被平均填充。

Answer 1

如果你是col-lg-9的div，你可以获取包装容器的9列（12个）的水平空间。

但这意味着必须有某种容器。请参阅此代码。

<!-- still full width -->
<div class="col-lg-9" style="background-color:green;">R</div>

<!-- 9/12 -->
<div class="container">
    <div class="col-lg-9" style="background-color:blue;">R</div>
</div>

所以要重新理解你的理解：如果你是div container，你可以将水平空间分成12列。 col-??-xx类分别从包装容器（或有时row或col-??-xx - div）获取xx / 12的水平空间。但请注意，网格需要以container或container-fluid开头，最初提供12列。

bootstap文档在grid system上有很好的部分，您可以阅读它以获取更多信息。如果您更像是实用型学习者，我建议您检查bootstrap提供的grid examples代码。

了解bootstrap 3中的网格系统？

1 个答案: