Bootstrap“ col”类是否可以与除div

Question

我想知道在Bootstrap中使用“ col”类的最佳实践是什么。

示例1 -我已经知道这种方式是有效的

<div class="row">
    <div class="col-12">
        <h1> Heading</h1>
    </div>
</div>  

示例2 -这也被认为是一种好习惯吗？

 <div class="row">
    <h1 class="col-12"> Heading</h1>    
</div>

感谢您的回答！

Answer 1

The Grid System documentation仅包含带有div元素的示例，尽管Bootstrap应用的CSS样式不受任何标签限制，但仅受类限制（例如.col-md-6而不是{{1} }）是一种将您的内容嵌套在div.col-md-6中的更好方法，至少有两个原因：

• 它将允许您稍后在同一列中添加其他内容，例如标题后的按钮或工具提示

• 使div标签的样式更好，并且不对标签的每一侧应用15px的自动装订线，这会使标题对齐不连贯

话虽如此，第二种方法可能会受益于更复杂的情况，但在这种情况下似乎不适用。

Answer 2

您也可以将网格与其他元素一起使用，因为它是类，但请尝试遵循编码和样式标准，以实现适当的代码管理和可读性。 根据哪个示例1是正确的方式

<div class="row">
   <div class="col-12">
      <h1> Heading</h1>
  </div>
</div>