如何使用 Bootstrap 创建多行列？

创建多行 Bootstrap 列

您通常可以通过让某些列跨越多行来增强 Bootstrap 网格的布局。此技术对于创建具有不同内容高度的视觉吸引力网格特别有用，例如提供的示例：

[单列跨越两行的网格图像]

Bootstrap 3

要在 Bootstrap 3 中实现此效果，可以使用嵌套的行和列。方法如下：

<div class="row">
    <div class="col-md-4">
        <div class="well">1
            <br>
            <br>
            <br>
            <br>
            <br>
        </div>
    </div>
    <div class="col-md-8">
        <div class="row">
            <div class="col-md-6">
                <div class="well">2</div>
            </div>
            <div class="col-md-6">
                <div class="well">3</div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="well">4</div>
            </div>
            <div class="col-md-6">
                <div class="well">5</div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-4">
        <div class="well">6</div>
    </div>
    <div class="col-md-4">
        <div class="well">7</div>
    </div>
    <div class="col-md-4">
        <div class="well">8</div>
    </div>
</div>

以上是如何使用 Bootstrap 创建多行列？的详细内容。更多信息请关注PHP中文网其他相关文章！