<hgroup>是一个二级元素,用于封装了一个或多个标题元素(<h1>到<h6>),如标题和子标题。作为<hgroup>只允许包含标题元素,一些例子可能是最简单的方式是展示在何时何地<hgroup>应该被使用。
了一篇文章,标题
当只有一个标题,就不需要<hgroup>元素:
<article>
<header>
<h1>All about flour</h1>
</header>
</article>
一篇文章,标题和元数据
不过,只有一个标题,所以即使有一些关于文章的元数据,<hgroup>元素是不相关:
<article>
<header>
<h1>All about flour</h1>
<p>Published on January 12th</p>
</header>
</article>
一篇文章,标题和副标题
现在我们有标题,所以我们可以使用<hgroup>元素:
<article>
<header>
<hgroup>
<h1>All about flour</h1>
<h2> Wheat flour is the backbone of the baked goods we love</h2>
</hgroup>
</header>
</article>
一篇文章,标题、子标题和元数据
当我们有几个标题和元数据,< hgroup >元素只包含实际的标题(应标注与< h1 >到<h6>元素):
试试这个例子
<article>
<header>
<hgroup>
<h1>All about flour</h1>
<h2> Wheat flour is the backbone of the baked goods we love</h2>
</hgroup>
<p>Published on January 12th</p>
</header>
</article>
你已经学会了:
< hgroup >元素总是在<header>元素
< hgroup >元素只包含标题(如字幕或标记线)上有< h1 >槽<h6>元素
所有其他<标题>相关内容应以外的< hgroup >元素。