3.3.2 大纲的编排规则（1）
关于内容区块的编排，可以分为"显式编排"与"隐式编排"两种方式。
1. 显式编排内容区块
显式编排是指明确使用section等元素创建文档结构，在每个内容区块内使用标题（h1~h6、hgroup等），如代码清单3-26所示。
代码清单3-26 显式编排内容区块示例
<body>
<h1>网页级内容区块标题</h1>
<p>网页级内容区块的正文</p>
<section>
<h2>section级内容区块的标题</h2>
<p>section级内容区块的正文</p>
</section>
</body>
2. 隐式编排内容区块
所谓隐式编排，是指不明确使用section等元素，而是根据页面中所书写的各级标题（h1~h6、hgroup等）把各级内容区块自动创建出来。因为HTML 5分析器只要看到书写了某个级别的标题，就会判断存在相对应的内容区块。代码清单3-27为一个隐式编排内容区块的示例。
代码清单3-27 隐式编排内容区块示例
<body>
<h1>网页级内容区块标题</h1>
<p>网页级内容区块的正文</p>
<!--分析器根据h2等元素判断生成内容区块-->
<h2>section级内容区块的标题</h2>
<p>section级内容区块的正文</p>
</body>
将这两种编排方式进行对比，很明显，显式编排更加清晰、明确、易读。
3. 标题分级
不同的标题有不同的级别，h1的级别最高，h6的级别最低。在进行隐式编排时按如下规则自动生成内容区块。
如果新出现的标题比上一个标题级别低，将生成下级内容区块。
如果新出现的标题比上一个标题级别高，或者两者的级别相等，将生成新的内容区块。
第一条规则的示例与前面一样，现在来看关于第二条规则的示例，如代码清单3-28所示。
代码清单3-28 第二条规则的示例
<body>
<section>
<h2>section级别的内容区块的标题</h2>
<p>section级别的内容区块的正文</p>
<!--因为下面的标题级别比上一个标题级别高，所以自动创建新的内容区块 -->
<h1>新的section级别的内容区块的标题</h1>
<p>新的section级别的内容区块的正文</p>
</section>
</body>
如果把上一个示例改成显式编排，如代码清单3-29所示。
代码清单3-29 第二条规则的显式编排示例
<body>
<section>
<h2>section级别的内容区块的标题</h2>
<p>section级别的内容区块的正文</p>
</section>
<section>
<h1>新的section级别的内容区块的标题</h1>
<p>新的section级别的内容区块的正文</p>
</section>
</body>
因为隐式编排容易使自动生成的整个文档结构与所想要的文档结构不一样，而且也容易引起文档结构的混乱，所以尽量使用显式编排。
4. 不同的内容区块可以使用相同级别的标题
另外，不同的内容区块可以使用相同级别的标题。例如，父内容区块与子内容区块可以使用相同级别的标题h1.这样做的好处是：每个级别的标题都可以单独设计，如果既需要"整个网页的标题",又需要"文章的标题"（譬如书写文档时），这样做将会带来很大的便利性，如代码清单3-30所示。
代码清单3-30 不同的内容区块可以使用相同级别的标题
<body>
<h1>网页的标题</h1>
<article>
<header>
<hgroup>
<h1>文章标题</h1>
<h2>文章子标题</h2>
</hgroup>
<p>文章正文</p>
</header>
</article>
</body>
相关HTML 5与CSS 3权威指南：大纲的编排规则（1）