3.5　对分级标题进行分组

有时，一个标题有多个连续的层级，例如带有子标题、替换标题或广告语。这时将它们放进hgroup元素可以指明它们是相关的，如图3.5.1所示。每个hgroup都包含两个或更多的h1～h6标题，不可放入其他元素。

在一个hgroup中，只有第一个最高级别的标题会出现在文档大纲中（参见3.4节），这也是你选择使用hgroup的一个决定因素。不过，需要指出，hgroup中的所有标题都会在浏览器中显示，如图3.5.2所示。

对两个或更多标题进行分组的步骤

  • 输入

    。

  • 输入，其中n是1～6的数字，此数字取决于要创建的标题的级别。

  • 输入标题的内容。

  • 输入，其中n是与第2步中相同的数字。

  • 重复2～4步，创建所有需成为hgroup一部分的标题。通常，每一个后续标题的级别都应低一级（例如，从h1到h2，依次类推）。

  • 输入。

  1. ...
  2. <body>
  3.  
  4. <article>
  5.      <hgroup>
  6.        <h1>Giraffe Escapes from Zoo</h1>
  7.        <h2>Animals Worldwide Rejoice</h2>
  8.      </hgroup>
  9.  
  10.      <p>... [文章内容] ...</p>
  11. </article>
  12.  
  13. </body>
  14. </html>

图3.5.1　两个相关的标题组合在一起。在此例中，h2是文章标题h1的子标题。由于Giraffe Escapes from Zoo被标记为最高级别的标题，因此只有它出现在文档大纲里，不过这两个标题都会出现在浏览器中，如图3.5.2所示。类似地，如果在这个h1后面再加一个h1，新的h1也不会出现在大纲里，就像上面的h2一样。由于h2并不出现在大纲里，文章中的下一个标题可以是h2（而不是h3），并且我们可以将其看做h1“Giraffe Escapes from Zoo”的直接子标题

3.5　对分级标题进行分组 - 图1

图3.5.2　两个标题都会显示在浏览器中，就像它们没被包含在hgroup元素中一样

提示　hgroup不能仅包含一个标题，至少要包含两个。

　

提示　如上所述，在一个hgroup中，只有第一个最高级别的标题会出现在文档大纲中，标题的顺序没有影响。因此，如果一个hgroup有一个h3，后面紧跟一个h2，那么h2会出现在大纲中。我们通常根据优先级对标题进行排序，因此低级别的标题（如h3）不会出现在级别高的标题（如h2）前面；偶尔可能遇到例外的情况。