分区根元素
<body>
| 元素 | 描述 |
|---|---|
<body> | 表示文档的内容。文档中只能有一个该元素。 |
内容分区
1. <address> - 联系信息
用于表示文档中个人、组织等的联系信息，常包括地址、电子邮件和电话号码。
<address>
地址：北京市朝阳区朝阳路1号<br>
电话：123-456-7890<br>
邮箱：contact@example.com
</address>
2. <article> - 独立内容
表示文档中的独立部分，例如新闻文章、博客内容等。它是一个独立的内容块，通常包含标题和相关内容。
<article>
<h3>新闻标题</h3>
<p>这是文章的内容部分，它是独立的，可以被单独引用或复用。</p>
</article>
3. <aside> - 侧边栏
用于表示与文档主要内容间接相关的部分。通常用于侧边栏、引用、广告或其他补充内容。
<aside>
<h3>相关链接</h3>
<ul>
<li><a href="#link1">链接1</a></li>
<li><a href="#link2">链接2</a></li>
</ul>
</aside>
4. <footer> - 页脚
用于表示文档或部分内容的页脚，通常包括版权信息、联系方式或与页面相关的其他链接。
<footer>
<p>版权所有 © 2024 Example.com</p>
<p>联系我们：info@example.com</p>
</footer>
5. <header> - 页头
用于表示文档或部分内容的顶部部分，通常包含标题、导航链接和其他介绍性内容。
<header>
<h1>欢迎来到我的网站</h1>
<nav>
<ul>
<li><a href="#home">首页</a></li>
<li><a href="#about">关于我们</a></li>
<li><a href="#services">服务</a></li>
<li><a href="#contact">联系</a></li>
</ul>
</nav>
</header>
6. <section> - 章节
表示文档中的一个独立章节。每个章节通常包含一个标题，并可以包含一组相关的内容。
<section>
<h3>章节标题</h3>
<p>这是章节的内容，详细描述了该章节的相关信息。</p>
</section>
内容分区总结
| 元素 | 描述 |
|---|---|
<address> | 表示其中的 HTML 提供了某个人、某些人或某个组织（等等）的联系信息。 |
<article> | 表示文档、页面、应用或网站中的独立结构，旨在成为可独立分配的或可复用的结构，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其它独立的内容项目。 |
<aside> | 表示文档的一部分，其内容仅与文档的主要内容间接相关。其通常以侧边栏或标注框（call-out box）的形式出现。 |
<footer> | 表示最近的一个父分段内容或分段的根元素的页脚。<footer> 通常包含该章节作者、版权数据或者与文档相关的链接等信息。 |
<header> | 表示介绍性内容，通常包含一组介绍性的或是辅助导航的实用元素。它可能包含一些标题元素，但也可能包含其它元素，比如 Logo、搜索框、作者名称和其它元素。 |
<h1>, <h2>, <h3>, <h4>, <h5>, <h6> | 表示六个不同的级别的章节标题，<h1> 级别最高，而 <h6> 级别最低。 |
<main> | 呈现了文档正文的主体部分。主体部分由与文档直接相关，或者扩展于文档的中心主题、应用的主要功能部分的内容组成。 |
<nav> | 表示页面的一部分，其目的是在当前文档或其它文档中提供导航链接。导航部分的常见示例是菜单、目录和索引。 |
<section> | 表示 HTML 文档中一个通用独立章节，它没有更具体的语义元素来表示。一般来说会包含一个标题。 |
