内容的HTML5元素？

应该使用哪些新的HTML5元素来代替div.container和div.content

<header>
  site header
</header>

<div class="container">

  <div class="content">

    <article>
      content
    </article>

    <article>
      content
    </article>

    <article>
      content
    </article>

  </div>

  <aside>
    sidebar
  <aside> 

</div>

<footer>
  site footer
</footer>

站点标题
内容
内容
内容
边栏
网站页脚

div.content

可能是

div.container

应该仍然是一个

div

它们都不是为此而制造的。但是我建议使用角色

<div class="container" role="document">

  <div class="content" role="main">

---

然后，它们也可以在CSS中与选择器一起使用，如

div[role='main']

我强烈建议您阅读上的

文章

和

部分

之间的区别

然后，您将能够对应该使用哪些剖切图元以及何时以及何时不使用div做出明智的判断

我从他们的博客中推测：

文章：用于内容本身就有意义

节：用于作为另一节或文章的逻辑节的内容（可以嵌套这些内容）

div：仍然用于容器或作为样式的挂钩，这是html5元素不应该用于的

最后，使用html5分段元素的决定通常可以由它包含一个标题这一事实来决定（尽管这不是一个硬性规定）。有几个有用的工具可以帮助做出这些决定

---

把这个问题看作是一个建设性的问题，它需要被解释为询问HTML5草案对这个问题的看法。那么答案就是W3CHTML5草案中的第4.13.1节。简单地说，它说通常您不需要任何特定的标记：只需将内容放在那里。显然，如果需要在CSS或脚本中将其作为一个单元来处理，可以将其包装在

div

元素中

根据该部分，如果它分别构成“较大作品的一部分，例如一章”或“可以想象独立聚合的独立内容单元”，则可以将其标记为

section

或

article

---

这是一个编码风格的问题。没有通用软件（如浏览器或搜索引擎）关心您在这里的选择。

一般来说，您无法回答此示例，它取决于页面的内容

这里重要的是你页面的大纲。因此，您可以忽略所有

div

元素，因为它们不会影响大纲。仅当您需要它们作为CSS或JavaScript的挂钩时才使用它们

第一个问题是：

旁边的
与整个页面相关还是与“内容区域”相关？如果它与整个页面相关，则不得包含在另一个剖切元素中。如果它与内容区域相关，则必须包含在该剖切元素中。这里我假设它与整个网页相关

第二个问题：三篇
文章
元素是否有共同的标题？例如：“我最喜欢的书”、“最新的博客帖子”或“产品”。如果是这样的话，您应该使用一个剖切元素来对这三个
文章
元素进行分组。如果没有可能的标题，您可能不希望在此处使用剖切元素，因此可以使用
div
或根本不使用元素

第三个问题（如果第二个问题的答案是肯定的）：这个分段元素应该是
分段
还是
文章
元素？如果您选择将
文章
元素用于这三个“事物”是正确的，那么您可能（但不是不可避免地！）需要在此处设置
部分
。同样，使用
文章
是否正确取决于实际内容。所以有可能你想要

<article> 
  <section></section>
  <section></section>
  <section></section>
</article>

有一个关于
元素的新提案。例如，这是一个有很多争议的问题，请参见。即使它成为现实，它也不是HTML5的一部分，而是HTML5之后的任何东西的一部分。同时，按照马特·惠普尔的建议使用
role=“main”
。
<section> 
  <article></article>
  <article></article>
  <article></article>
</section>

<header>
  <!-- if this header applies to the whole page -->
</header>

<section>

  <!-- a h1 like "Latest blog posts" -->

    <article>
      content
    </article>

    <article>
      content
    </article>

    <article>
      content
    </article>

</section>

<aside>
    <!-- if this aside applies to the whole page -->
<aside> 

<footer>
  <!-- if this footer applies to the whole page -->
</footer>