主页 / 问题 / 943737
Accepted
Родион Поляков
Asked:2020-02-12 10:10:00 +0000 UTC2020-02-12 10:10:00 +0000 UTC

Bootstrap 4 中的网格布局

  • 772

有两种标记选项，但哪一种是正确的？

<div class="container">
    <div class="row">
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>

        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
    </div>
</div>

或者

<div class="container">
    <div class="row">
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
    </div>

    <div class="row">
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
        <div class="col-3"></div>
    </div>
</div>
html

2 个回答

  1. Best Answer

    两个选项都是正确的。一切都取决于情况。即使在 Bootstrap 4 文档本身中，也有一个示例，其中使用了条件总和大于 12 的列。

    混合搭配]

    有一个有趣的材料（英文），其中给出了使用第一个选项的几个示例，对初学者很有用。

    • 2

  2. row- 类允许所有块排成一行。在这种情况下，第二个选项是正确的，因为最多有 12 个网格，并且您填充了所有 12 个。在选项 1 中，您尝试将 24 个网格塞入12格，所以它会滚下来。（md，sm，lg，xs在哪里）？

    • 1

相关问题