HTML文档分节

1. 添加基本的标题

HTML定义了一套标题元素体系，从h1到h6，h1级别最高。

2. 隐藏子标题

hgroup元素可以用来将几个标题元素作为一个整体处理，以免扰乱HTML文档的大纲。

<hgroup>
    <h1>Fruits I Like</h1>
    <h2>How I Learned to Love Citrus</h2>
</hgroup>

hgroup元素在从h1到h6的标题体系中的位置取决于其第一个标题子元素。(hgroup元素的子元素中，只有第一个标题子元素会被列入文档的大纲。)

3. 生成节

section元素表示文档中的一节。section元素用来包含的是那种应该列入文档大纲或目录的内容。section元素通常包含一个或多个段落及一个标题。

4. 添加首部和尾部

首部

header元素表示一节的首部（通常包含各种适合出现在首部的东西，包括刊头和徽标）。

尾部

footer元素表示一节的尾部（通常包含着该节的总结信息，还可以包含作者介绍、版权信息、到相关内容的链接、徽标及免责声明等 ）。

5. 添加导航区域

nav元素表示文档中的一个区域，它包含着到其他页面或同一页面的其他部分的链接。该元素的目的是规划出文档的主要导航区域。

<header>
    <nav>
        <ul>
            <li><a href="#">链接1</a></li>
            <li><a href="#">链接2</a></li>
            <li><a href="#">链接3</a></li>
        </ul>
    </nav>
</header>

6. 使用article

article元素代表HTML元素中一段独立成篇的内容。（可以独立于页面其余内容发布或使用）

7. 生成附注栏

aside元素用来表示跟周边内容稍沾一点边的内容，类似于书籍或杂志中的侧栏。其内容与页面的其他内容、article或section有点关系，但并非主体内容的一部分。它可能是一些背景信息、到相关文章的链接，诸如此类。

8. 提供联系信息

address元素用来表示文档或article元素的联系信息。

<address>
    Content us <a href="mailto:example@qq.com">Email us</a>
</address>

9. 生成详情区域

details元素在文档中生成一个区域，用户可以展开它以了解关于某主题的更多详情。

<details>
    <summary>我喜欢的水果</summary> <-- summary元素为该详情区域生成一个说明标签或标题 -->
    <ul>
        <li>苹果</li>
        <li>香蕉</li>
        <li>荔枝</li>
    </ul>
</details>