English 中文 العربية 日本語 Português

<hgroup>: HGROUP 要素

最終更新：2026-10-13

<hgroup>HGROUP 要素

見出しのグループ（<h1>–<h6>）をまとめ、タイトルとサブタイトルなどを 1 つの見出しブロックとして扱います。

カテゴリセマンティック
コンテンツモデルフローコンテンツ
許可される親要素フローコンテンツを受け入れる要素
閉じタグ必要 </hgroup> タグ
ステータス標準

📝 構文

<hgroup>
  <h1>メインタイトル</h1>
  <h2>サブタイトル</h2>
</hgroup>
すべてのグローバル属性を見る → すべてのイベント属性を見る →

▶ サンプル

下のコードを編集して、playground でリアルタイム結果を確認：

▶ 試してみる

🌐 ブラウザサポート

ブラウザ ChromeChrome EdgeEdge FirefoxFirefox SafariSafari OperaOpera
<hgroup> ✓ v1 ✓ v12 ✓ v1 ✓ v1 ✓ v1
すべての主要ブラウザでサポート
ヒント： hgroup は見出しのみを含めるべきです。SEO では通常トップレベルの <h1> がページタイトルとして扱われます。

❓ よくある質問

Qhgroup は何に使うものですか？
A<hgroup> は「見出し＋サブタイトル」をひと組に束ねます。たとえば <hgroup><h1>メインタイトル</h1><p>サブタイトルの説明</p></hgroup> のように書きます。補助技術に対して「これらの要素がひとつの見出しブロックを構成する」と伝えます。
Qhgroup の中の p は本文扱いになりますか？
A<hgroup> の内側では、<p> は通常の段落ではなく「サブタイトル」と解釈されます（hgroup に置けるのは h1-h6 と p だけです）。CSS でサブタイトル風の装飾を付けられます。画像やリンクリストなど、それ以外の内容を置くのは不正です。
Qhgroup の対応状況は？今も必要ですか？
Aブラウザは <hgroup> に特別な描画をしません（ただのコンテナです）。歴史上、一度廃止候補になって復活した経緯があります。サブタイトルに「見出しグループ」の意味が不要なら、<header> で h1 と p を包むだけでも十分です。厳密な文書アウトラインの意味が必要なときに hgroup を使いましょう。
<h1> <header> <section>
今後さらにケーススタディを追加予定です。

📚 関連チュートリアル

HTML タグリファレンス
すべての HTML タグの構文・属性・例を確認できます。
Web-Tutorial.com

Web-Tutorial 技術チーム

複数の開発者によって共同維持されているプログラミングチュートリアルプラットフォーム。各チュートリアルは専門分野の開発者が執筆・レビューしています。正確で信頼性の高いコンテンツを目指しています — 問題を見つけた場合はお知らせください。

100%