在引导网格上，行的子代与 col 不同的问题是什么？

Question

昨天我正在审查我们的 HTML 结构，发现我们有容器用作这样的 row child

<section class="row graySeccion">
  <div class="container py-5 graySeccion">
    <div class="row mb-5">
      <div class="col py-2 text-center">
        <h1>WELCOME TO STEAM SCHOOLS</h1>
      </div>
    </div>

但是看着oficial documentation我可以看到这个注释。

In a grid layout, content must be placed within columns and only columns may be immediate children of rows.

我们有这个 row->container->row 有多大的错误，我们可能会破坏哪些东西？
我们应该开始重构我们的 HTML 结构吗？

Answer 1

是的，理想情况下，您应该遵循适当的网格布局结构。

row 类包含以下属性：

.row {
  margin-right: -15px;
  margin-left: -15px;
}

由于row 的这个属性，在某些分辨率的页面上会出现水平滚动条。为了避免这种情况，我们需要遵循 bootstrap (container->row->col) 的官方文档。