css - HTML5 和 Bootstrap 类 ="container"，它可以应用于 body 还是只应用于 div？

我一直碰到这个问题，每个人都保持: a) 想要用 div 包装 HTML5 语义标签，以及 b) 想要将类选择器应用于 div 而不是语义标签。就好像人们出于某种原因害怕将类拍打到语义标签上。

例如，我经常被告知这是“不正确的”，

<body class="container">
    <header class="row">
        <div class="col-md-12"> ...

这样的东西更可取，

<body>
   <div class="container">
      <div class="row">
          <div class="col-md-12"> ...

在这里，第一个例子我在 h2 标签中有列类

    <div class="row">
        <h2 class="col-4 feature">Featured Work</h2>
    </div>

但是“正确”的方法是添加另一个 div 标签来应用该类，

    <div class="row">
        <div class="col-4 feature">
            <h2>Featured Work</h2>
        </div>
    </div>

我知道这可能是基于意见的，但我发现在处理 HTML5 时，意见实际上很重要，因为几乎每个人都有问题，没有其他方法可以在没有意见的情况下敲定细节。

最佳答案

我建议坚持

<body>
   <div class="container">
      <div class="row">
          <div class="col-md-12"> ...

格式。

如果您打算与许多其他开发人员一起工作或使用 Bootstrap 模板，您会看到容器类通常嵌套行类div。

由于我们谈论的是标记，因此没有正确答案，但强烈建议遵循此约定。

保持一致性
为了轻松更改样式和与其他元素的可重用性 - 这甚至打开了直接替换其他元素或 Bootstrap 模板中的 css 样式表的大门。 (我在这方面取得了一些令人惊讶的好结果)。

但是，如果您坚持要为非 div 标签提供“container”和“col-X”标签，请保持一致。不过，我不会推荐它，并且会将任何遵循其自身约定的模板视为代码质量差的指标。

关于css - HTML5 和 Bootstrap 类 ="container"，它可以应用于 body 还是只应用于 div？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27951814/