HTML5学习系列之主结构

前言
HTML5主结构
- 定义页眉
- 定义导航
- 定义主要区域
- 定义文章块
- 定义区块
- 定义附栏
- 定义页脚
具体使用
总结

前言

学习记录

HTML5主结构

定义页眉

head表示页眉，用来表示标题栏，引导和导航作用的结构元素。

<header role="banner">
</header>

可以使用h1~h6
不可以header中再嵌套footer或header

定义导航

nav表示导航条，可以使用多个nav，作为页面整体或不同部分的导航。

<nav draggable="true"><a href="index.html">首页</a>
</nav>

定义主要区域

main表示主要区域，用于标识网页的主要内容，并且唯一。

定义文章块

article表示文章块，用来标识页面中一块完整的、独立的、可以转发的内容。

定义区块

section表示区块，用于标识文档中的节，多用于对内容进行分区。标记的是页面中的特定区域。

<main role="main"><h1>主要标题</h1><section><h2>xx</h2></section>
</main>

定义附栏

aside表示附栏，用来标识所处内容之外的内容。作为主体内容的附属信息部分，包含在article中。作为页面或站点辅助功能部分，在article之外使用。

定义页脚

footer表示脚注，用来标识文档或节的页脚。

具体使用

<header><h1>[网页标题]</h1><h2>[次级标题]</h2><h3>[标题提示]</h3>
</header>
<main><nav><h3>[导航栏]</h3><a href="#">链接1</a></nav><section><h2>[文章块]</h2><article><header><h1>[文章标题]</h1></header><p>[文章内容]</p><footer><h2>[文章脚注]</h2></footer></article></section><aside><h3>[辅助信息]</h3></aside><footer><h2>[网页脚注]</h2></footer>
</main>