HTML 5语义标记应该用于样式吗？

Question

我必须承认HTML5语义标记让我感到困惑。我特别在谈论这些标签：

<header>
<nav>
<section>
<article>
<aside>
<footer>

使用语义元素为UA提供了通常无法从<div>获取的信息，但是它们是否应与一起使用 <div>标记，或者可以/应该使用直接设置语义标记？

换句话说，什么是正确的方法？

此：

<div id="content">
    <section>
        <h1>Lorem ipsum></h1>
        <p>Text</p>
    </section>
</div>

或者这个：

<section id="content">
    <h1>Lorem ipsum></h1>
    <p>Text</p>
</section>

Answer 1

如果您使用语义标记标记，则不应对同一事物使用分区标记。语义标签是一些div标签的替代品。

div标签当然仍然有用，因为当没有适合的语义标签时。

Answer 2

我相信您的第一个示例在语义上是正确的，假设您在section标记中有更多div个标记。

div标记意味着网页的一部分用于内容，然后section标记就像帖子一样。

Answer 3

由于新标记未被浏览器普遍识别，即使作为样式的候选者，使用div和class也更安全。您还可以像以前一样只使用div与class，并且您现在或在可预见的将来不会丢失任何内容。没有软件关心新标签的“语义”。

Answer 4

第一个例子使用起来更安全。

<section>
  <h1>Lorem ipsum></h1>
  <p>Text</p>
</section>

是内容。

为了设置此内容的样式，您可以将其包装在容器中，例如。 div带有样式挂钩（类）并为其应用样式。