我们都知道，在HTML5中，引入了一批新的语义标签，比如<header>,<section>,<footer>,<nav>,<aside>,<article>,<blockqouet>等等。
之所以加入这些标签，是为了解决HTML4中的div与h标签无法清晰的表示整个文档的大纲，导致整个文档的结构层次混乱。
知道了这些标签的由来和作用，我们就能很容易地判定该在何时再哪种上下文环境中应用这些标签。
下面就分别来说说这些用于生成大纲的语义标签在何时使用。
<!doctype html>
<html>
<head></head>
<!--注意，新的大纲语义标签全部用于body中-->
<body>
<header>
<nav></nav>
<!--nav标签包含了一系列链接，这些内部或外部链接不计入文档大纲，一般用于导航菜单-->
</header>
<!--header标签定义了页面头部，它通常包含网站logo，站点名称和可能的水平菜单（导航），该标签里的内容不计入文档的大纲，所以，如果你的内容是包含在文档大纲中的，请不要将它放入header-->
<section></section>
<!--section，分节。类似于我们小学语文时根据段落间的相关度将若干个段落分为一组，整个正文部分被分为好几个组，不同的是，在这里，每个分组里面的内容还可以再分组(嵌套)，总之，每个分节里的内容都是具有很强相关度的-->
<section>
<section></section>
<section>
<h1>标题一</h1>
<p>这里是一段文字</p>
<article>
<h2>文章的标题</h2>
<p>文章的摘要</p>
<p>文章的内容</p> <!--这里是整篇文章，由于篇幅，这里用一个p标签代表-->
</article>
<!--一个文档可以由不同作者的不同节段组成。一个从其他作者而不是文档作者写的节段用<article>元素定义。该标签主要用于带有摘要的文章列表和文章内容页-->
</section>
<aside></aside>
<!--aside标签主要用于与大纲内容无关的文档流，例如解释栏，广告栏，阅读排行，推荐文章等，而且大多数情况下，被用于侧栏-->
</section>
<section>
<h3>我的论点</h3>
<section>
<h4>论点一：XXX</h4>
<blockquote>尼采说：XXXXXXX</blockquote>
<!--blockquote是一个块级引用,如其名称，主要用于引用一段外部内容，该内容不计入文档大纲-->
</section>
<section></section>
</section>
<footer></footer>
<!--footer定义了页脚，典型地，被用来包含版权信息，法律声明和一些其他链接（友情链接）-->
</body>
</html>还有很多标签，由于不常用，这里就先不说了。
2625
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
