html5附带了一堆新元素，将来还会推荐更多。但是，有些元素的实现可能会有些混乱，包括以下两个新元素：<article>和<section>。
我在论坛上发现的一些最常见的问题是：在什么情况下应使用这些元素？而同样，我们如何正确地使用这些内容？
<section>元素这可能是最含糊的元素之一。这些年来，我们已经使用<div>元素为切片在我们的网页结构。因此，出现了一个问题，因为它与<div>element?有什么不同，何时应该在element之外使用此<div>element。
要揭开它的神秘面纱，我们需要参考官方文档。根据whatwg文档，其<section>描述如下：
“?<section>元素代表文档或应用程序的通用部分。?whatwg”
从该描述中，我们可以得出结论，该<section>元素或多或少像<div>元素一样肯定是用于分段的。但是有一个例外。该文档添加了一些特定的额外说明，说明：
“当仅出于样式目的或为了方便编写脚本而需要元素时，鼓励作者改用div元素……一般规则是，仅当元素的内容明确列出时，section元素才是适当的……?whatwg”
在这一点上，事情变得更轻松了，我们可以从两点总结该描述：
尽管section元素在技术上是可样式化的，但建议<div>在我们更可能将沉重的样式或脚本应用于该元素时使用它。与<li>element?相似，section element的一般思想是列出content。因此，在实际情况下，使用<section>元素的明智原因之一是构建博客文章内容列表，如以下代码片段所示：
1个
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div class=blog>
<section class=post>
<h2 class=post-title>blog post title</h2>
<p class=post-excerpt>ice cream tart powder jelly-o.
gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
<section class=post>
<h2 class=post-title>blog post title</h2>
<p class=post-excerpt>ice cream tart powder jelly-o.
gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
<section class=post>
<h2 class=post-title>blog post title</h2>
<p class=post-excerpt>ice cream tart powder jelly-o.
gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.</p>
</section>
</div>
这只是一个例子。我们可以将此元素用于其他目的。
<article>元素这个名称本身是不言自明的，但是让我们看看官方文档是如何描述它的：
“文件，页面，应用程序或网站中的独立文件，原则上可以独立分发或重用，例如在联合组织中。这可以是论坛帖子，杂志或报纸文章，博客条目，用户提交的评论，交互式小部件或小工具或任何其他独立的内容。“
从上面的解释中，我们可以得出结论，特别<article>推荐将元素用于结构化文章，尤其是我们可能要联合的文章，例如博客文章，页面内容或论坛文章。
以下示例说明了如何使用来构建博客文章内容<article>。
1个
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18岁
19
<article class=post>
<header>
<h1>this is blog post title</h1>
<div class=post-meta>
<ul>
<li class=author>author name</li>
<li class=categories>save in categories</li>
</ul>
</div>
</header>
<div class=post-content>
sweet roll halvah biscuit toffee liquorice tart pudding sesame snaps.
biscuit powder jelly-o fruitcake faworki chocolate bar. pudding oat
cake tootsie roll sesame snaps lollipop gingerbread bonbon. gummies
halvah gummies danish biscuit applicake gingerbread jelly-o pastry.
</div>
</article>
此外，该<article>元素可以与section元素结合使用，因此，在<section>合理的情况下，例如以下示例，可以将文章与element?分为几个部分。
1个
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18岁
19
20
21
22
23
24
25
26
27
28
29
30
<article class=post>
<header>
<h1>this is blog post title</h1>
<div class=post-meta>
<ul>
<li class=author>author name</li>
<li class=categories>save in categories</li>
</ul>
</div>
</header>
<div class=post-content>
<section>
<h2>this is the sub-heading</h2>
sweet roll halvah biscuit toffee liquorice tart pudding sesame snaps.
biscuit powder jelly-o fruitcake faworki chocolate bar. pudding oat cake
tootsie roll sesame snaps lollipop gingerbread bonbon. gummies halvah
gummies danish biscuit applicake gingerbread jelly-o pastry.
</section>
<section>
<h4>this is another sub-heading</h4>
topping cheesecake sweet pie carrot cake sweet roll. gummi be