<hgroup>: 見出しグループ要素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

<hgroup> はHTML の要素で、見出しとそれに関連する内容を表します。これは 1 つの<h1>–<h6> 要素と、1 つ以上の<p> 要素をグループ化します。

試してみましょう

<hgroup>  <h1>Frankenstein</h1>  <p>Or: The Modern Prometheus</p></hgroup><p>  Victor Frankenstein, a Swiss scientist, has a great ambition: to create  intelligent life. But when his creature first stirs, he realizes he has made a  monster. A monster which, abandoned by his master and shunned by everyone who  sees it, follows Dr Frankenstein to the very ends of the earth.</p>

hgroup {  text-align: right;  padding-right: 16px;  border-right: 10px solid #00c8d7;}hgroup h1 {  margin-bottom: 0;}hgroup p {  margin: 0;  font-weight: bold;}

属性

この要素にはグローバル属性のみがあります。

使用上の注意

<hgroup> 要素は、見出しと副次的な内容（副題や代替タイトル、キャッチフレーズなど）をグループ化することが可能です。これらのコンテンツは、<hgroup> 要素内の<p> 要素として表現されます。

<hgroup> 要素自体は、ウェブページの文書のアウトラインに影響を与えません。むしろ、<hgroup> 内で許可されている単一の見出しが文書のアウトラインに寄与します。

例

html

<!doctype html><title>HTML Standard</title><body>  <hgroup>    <h1>HTML: Living Standard</h1>    <p>Last Updated 12 July 2022</p>  </hgroup>  <p>Some intro to the document.</p>  <h2>Table of contents</h2>  <ol>    …  </ol>  <h2>First section</h2>  <p>Some intro to the first section.</p></body>

結果

技術的概要

コンテンツカテゴリー	フローコンテンツ, 見出しコンテンツ, 知覚可能コンテンツ
許可されている内容	0 個以上の`<p>` と、それに続く 1 個のh1,h2,h3,h4,h5,h6 と、それに続く 0 個以上の`<p>`
タグの省略	なし。開始タグと終了タグの両方が必須です。
許可されている親要素	フローコンテンツを受け入れるすべての要素
暗黙の ARIA ロール	`group`
許可されている ARIA ロール	すべて
DOM インターフェイス	`HTMLElement`