Bootstrap嵌套网格系统最佳实践

Question

Bootstrap嵌套网格系统最佳实践

htmlcsstwitter-bootstraptwitter-bootstrap-3grid-system

34

我正在尝试使用Bootstrap创建一个网站，不使用外部CSS。似乎我可以使用嵌套的网格系统实现许多格式化目标。

例如：

<div class="container-fluid bs-docs-grid">
    <div class="row show-grid">
        <div class="col-md-6">
            <div class="row show-grid">
                <div class="col-md-4">
                </div>
                <div class="col-md-4">
                </div>
            </div>
        </div>
        <div class="col-md-6">
        </div>
    </div>
</div>

这是一个合理的做法吗？

- Ben Pearce

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- David Taiaroa · Accepted Answer

你的嵌套代码正是Bootstrap建议的方法：http://getbootstrap.com/css/#grid-nesting
以及
https://getbootstrap.com/docs/4.4/layout/grid/#nesting（适用于Bootstrap 4）

除非你有特定需要使用show-grid和bs-docs-grid类，否则无需包含它们。它们不属于基本的Bootstrap CSS。

如果你可以使用嵌套网格实现所需的布局，我肯定会使用它们。这将为您节省时间并减少潜在的浏览器兼容性问题。

祝你好运！