Widely available すべての主要ブラウザで対応済み。安心して使用可能。

<hgroup>

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

テキスト・構造

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
<hgroup>
5
12
4
5
18
4.2
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

HTML 
<hgroup>
  <h1>Main Title</h1>
  <p>Subtitle or supplementary text</p>
</hgroup>

ライブデモ

タイトルとサブタイトル

hgroup で見出しとサブタイトルをグループ化。

プレビュー全画面表示

記事ヘッダーでの使用

記事の見出しとキャッチコピーを hgroup でまとめる。

プレビュー全画面表示

複数レベルの見出しグループ

異なるレベルの見出しを hgroup で組み合わせ。

プレビュー全画面表示

実務での使いどころ

  • <hgroup> の活用

    <hgroup> は HTML の要素で、見出しとそれに関連する内容を表します。

注意点

  • 古いブラウザでは対応していない場合がある。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。

参考リンク