形式

<hgroup>～</hgroup>

サポート

LS / H5d-5d / e9 / Ch5 / Fx4 / Sa4.1 / Op11.1

カテゴリ

フローコンテンツ

ヘッディングコンテンツ

パルパブルコンテンツ

親要素

フローコンテンツ を子要素に持てるもの

子要素

ひとつ以上の h1～h6 要素および template 要素

タグの省略

開始タグ：必須、終了タグ：必須

属性

グローバル属性

hgroup は Header Group の略で、複数のヘッダ(h1～h6)をグルーピングします。

グローバル属性

詳細は グローバル属性 を参照してください。

hgroup は、HTML5 の草案で採用が検討されていましたが、最終勧告では破棄されました。HTML 5.1 でも採用されていませんが、HTML Living Standard で定義されています。

h1 や h2 でサブタイトルを記述した場合に、これらをひとつのタイトルとして扱いたい場合に使用します。

HTML5 では、暗黙的なセクションの概念があります。

<h1>タイトル１</h1>
<p>本文...</p>
<h1>タイトル２</h1>
<p>本文...</p>

のような文書の構造は、下記のように解釈されます。

また、

<h1>タイトル１</h1>
<p>本文...</p>
<h2>タイトル２</h2>
<p>本文...</p>

のような文書の構造は、下記のように解釈されます。

ここで、

<h1>ドラゴンクエストⅢ</h1>
<h2>そして伝説へ...</h2>
<p>本文...</p>

と記述すると、

と解釈されてしまいますが、hgroupを用いることにより、

<hgroup>
 <h1>ドラゴンクエストⅢ</h1>
 <h2>そして伝説へ...</h2>
</hgroup>
<p>本文...</p>

が、下記のように解釈され、h1＋h2 がひとつのヘッダのように扱われます。

<header>
 <hgroup>
  <h1>Scalable Vector Graphics (SVG) 1.2</h1>
  <h2>W3C Working Draft 27 October 2004</h2>
 </hgroup>
 <dl>
  <dt>This version:</dt>
  <dd><a href="http://www.w3.org/.../">http://www.w3.org/...</a></dd>
  <dt>Previous version:</dt>
  <dd><a href="http://www.w3.org/...">http://www.w3.org/...</a></dd>
  <dt>Latest version of SVG 1.2:</dt>
  <dd><a href="http://www.w3.org/...">http://www.w3.org/...</a></dd>
  <dt>Latest SVG Recommendation:</dt>
  <dd><a href="http://www.w3.org/...">http://www.w3.org/...</a></dd>
  <dt>Editor:</dt>
  <dd>Dean Jackson, W3C, <a href="mailto:dean@w3.org">dean@w3.org</a></dd>
  <dt>Authors:</dt>
  <dd>See <a href="#authors">Author List</a></dd>
 </dl>
 <p class="copyright"><a href="http://www.w3.org/Consortium/Legal/ipr-notic ...
</header>

• https://html.spec.whatwg.org/multipage/sections.html#the-hgroup-element
• https://developer.mozilla.org/ja/docs/Web/HTML/Element/hgroup
• https://caniuse.com/#search=Obsolete%2Fdeprecated%20HTML%20elements