<hgroup>

HTML <hgroup> element代表文档章节所属的多级别的目录,它将多个<h1>至<h6>的子元素组装到一起。

尝试一下

Content categories (en-US) Flow content (en-US), heading content, palpable content.
Permitted content One or more <h1> (en-US), <h2> (en-US), <h3> (en-US), <h4> (en-US), <h5> (en-US), and/or <h6> (en-US).
Tag omission 不允许,开始标签和结束标签都不能省略。
Permitted parent elements Any element that accepts flow content (en-US).
Permitted ARIA roles tab, presentation
DOM interface HTMLElement

属性

这个元素仅包含全局属性。

使用笔记

备注: 本元素已经从 HTML5(W3C)规范中删除,但是它仍旧在 WHATWG 的 HTML 版本里。大多数浏览器都部分地实现,所以它不太可能消失。 然而,考虑到<hgroup>元素的一个关键存在目标是明确 HTML 规范中如何显示标题的轮廓算法,但因为其轮廓算法 (outline algorithm) 未在任何浏览器中实现,因此 <hgroup> 语义仍旧是理论上的建议。 HTML5 (W3C) 规范提供了如何标记副标题,小标题,可选标题和标语(Subheadings, subtitles, alternative titles and taglines)的建议。

The <hgroup> element allows the primary heading for a document section to be grouped with any secondary headings—such as subheadings or alternative titles—to form a multi-level heading.

In other words, the <hgroup> element prevents any of its secondary <h1>–<h6> children from creating separate sections of their own in the outline—as those <h1>–<h6> elements otherwise normally would if they were not children of any <hgroup>.

So in the abstract outline produced by the HTML outline algorithm defined in the HTML specification (en-US), the <hgroup> as a whole forms a single logical heading, with the entire set of <h1>–<h6> children of the <hgroup> going into the outline as one multi-level unit, to comprise that single logical heading in the abstract outline.

To produce any (non-abstract) rendered view of such an outline, some choice must be made in the design of the rendering tool about how to render <hgroup> headings in such a way as to convey their multi-level nature. There are a variety of ways an <hgroup> might be shown in a rendered outline; for example:

  • an <hgroup> might be shown in a rendered outline in with a colon character and space (": ") or other such punctuation after the primary heading and before the first secondary heading (and with the same or similar punctuation before any other secondary headings
  • an <hgroup> might be shown in a rendered outline in with the primary heading followed by parentheses around the secondary heading(s)

Consider the following HTML document:

<!DOCTYPE html>
<title>HTML Standard</title>
<body>
  <hgroup id="document-title">
    <h1>HTML</h1>
    <h2>Living Standard — Last Updated 12 August 2016</h2>
  </hgroup>
  <p>Some intro to the document.</p>
  <h2>Table of contents</h2>
  <ol id=toc>...</ol>
  <h2>First section</h2>
  <p>Some intro to the first section.</p>
</body>

A rendered outline for that document might look like the following:

That is, the rendered outline might show the primary title, HTML, followed by a colon and space, followed by the secondary title, Living Standard — Last Updated 12 August 2016.

Or, the rendered outline for that document might instead look like the following:

Rendered outline that includes an <hgroup> element, with parens around the secondary heading

That is, the rendered outline might show the primary title, HTML, followed by the secondary title shown in parentheses: (Living Standard — Last Updated 12 August 2016).

示例

<hgroup>
  <h1>Main title</h1>
  <h2>Secondary title</h2>
</hgroup>

浏览器兼容性

BCD tables only load in the browser

参阅