html - 应该有 还是 应该有 ？

Question

我正在阅读 Mark Pilgirm 的“Dive into HTML5”和 semantics section ，它讨论了 HTML5 如何引入 <article>和 <section>元素。它说 <section> s 代表通用文档或部分，而 <article> s 代表一个独立的组合。无论哪种方式，我都看不到逻辑上语义上的父子关系。

我尝试通过 HTML5 Outliner 运行以下代码并且它似乎表明无论它们如何嵌套，文档大纲都是一样的。

所以我的问题是:应该 <section>嵌套在 <article> 中s，应该<article>嵌套在 <secion> 中s，还是从语义的角度来看无关紧要？

<section><h1>section article?</h1>
  <article><h1>art 1</h1></article>
  <article><h1>art 2</h1></article>
  <article><h1>art 3</h1></article>
</section>

<article><h1>article section?</h1>
  <section><h1>sec 1</h1></section>
  <section><h1>sec 2</h1></section>
  <section><h1>sec 3</h1></section>
</article>

Answer 1

以任何一种方式嵌套它们都是完全可以接受的。虽然文档大纲没有区分<section>和一个 <article> ，从语义的角度来看，它们是两个不同的东西。这就是将它们作为两个不同的语义元素引入的全部意义所在。

如果您的页面包含多篇文章，请使用第一个代码段。

当您的文章足够全面以包含多个部分时，请使用第二个片段。

如果两者都适合您的内容，您甚至可以将它们结合起来，这样您的标记如下所示:

<section><h1>section article?</h1>
  <article><h1>art 1</h1>
    <section><h1>sec 1.1</h1></section>
    <section><h1>sec 1.2</h1></section>
    <section><h1>sec 1.3</h1></section>
  </article>
  <article><h1>art 2</h1>
    <section><h1>sec 2.1</h1></section>
    <section><h1>sec 2.2</h1></section>
    <section><h1>sec 2.3</h1></section>
  </article>
  <article><h1>art 3</h1>
    <section><h1>sec 3.1</h1></section>
    <section><h1>sec 3.2</h1></section>
    <section><h1>sec 3.3</h1></section>
  </article>
</section>