本文目标：了解如何在HTML中使用容器标签，并找出适合的容器标签。
容器标签
HTML提供了一组容器标签。这些标记可以包含一组未指定的其他标签。
常见的有以下：
- article
- section
- div
理解它们之间的区别可能会令人困惑。
接下来让我们看看什么时候应该使用这些标签。
article
article标签标识可以独立于页面中的其他内容的内容。
例如，首页中的博客文章列表。
或链接列表。
<!--前端教程网-->
<div>
<article>
<h2>A blog post</h2>
<a ...>Read more</a>
</article>
<article>
<h2>Another blog post</h2>
<a ...>Read more</a>
</article>
</div>我们并不局限于列表:article可以是页面中的主要元素。
<article>
<h2>A blog post</h2>
<p>Here is the content...</p>
</article>在article标签中，我们应该使用h1~h6标题标签。
section
表示文档的一部分。每个节都有一个标题标记(h1-h6)，然后是section主体。
例子:
<section>
<h2>A section of the page</h2>
<p>...</p>
<img ... />
</section>把一篇长文章分成不同的部分是很有用的。
不应该用作泛型容器元素。而div就是为此而创建的。
div
div是通用的容器元素:
<div>
...
</div>您经常向这个元素添加一个类或id属性，以允许它使用CSS进行样式化。
我们在需要容器但现有标记不适合的任何地方使用div。
与页面相关的标签
nav
此标记用于创建定义页面导航的标记。我们通常会在其中添加一个ul或ol列表:
<nav>
<ol>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
</ol>
</nav>aside
aside标签用于添加与主内容相关的内容。
例如，要在其中添加引用的框。或一个侧边栏。
例子:
<div>
<p>some text..</p>
<aside>
<p>A quote..</p>
</aside>
<p>other text...</p>
</div>aside标签用于添加与主内容相关的内容。
header
header标记表示页面的一部分，即介绍部分。例如，它可以包含一个或多个标题标记(h1-h6)、文章的标记、图片。
<article>
<header>
<h1>Article title</h1>
</header>
...
</article>main
mian标签表示页面的主要部分:
<body>
....
<main>
<p>....</p>
</main>
</body>footer
页脚标签用于确定文章的页脚，或页面的页脚:
<article>
....
<footer>
<p>Footer notes..</p>
</footer>
</article>