HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLのhgroupタグとは？基本構文と使い方をサンプルコード付きで解説

<hgroup>タグは、HTML文書における見出しをまとめるための要素で、<h1>から<h6>までの見出し要素をひとつのグループとして扱うために使用されます。主に、メインの見出しとサブタイトル（副題）をセットで表現したい場合に利用されてきました。

注意：<hgroup>タグはHTML5で導入されましたが、その後非推奨（deprecated）となり、W3CのHTML5仕様からは削除されています。ただし、WHATWGが策定するHTML Living Standardでは引き続き定義されているため、ブラウザによっては動作します。新規のコーディングでの使用は避け、必要に応じて<header>要素などを検討するのが無難です。

以下が<hgroup>の基本的な構文です。

<hgroup>
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
</hgroup>

それでは、HTMLで<hgroup>要素を実際に実装する例を見ていきましょう。

使用例

<!DOCTYPE html>
<html>
<head>
<title>Document Title</title>
</head>
<body>
<hgroup>
    <h1>デモ見出し1</h1>
    <h2>デモ見出し2</h2>
</hgroup>
    <p>これはデモ用のテキストです。</p>
    <p>これはデモ用のテキストです。</p>
    <p>これはデモ用のテキストです。</p>
    <p>これはデモ用のテキストです。</p>
</body>
</html>

出力結果

HTMLのhgroupタグとは？基本構文と使い方をサンプルコード付きで解説

上記の例では、<hgroup>の中に2つの見出し（<h1>と<h2>）を設定しています。

<hgroup>
<h1>デモ見出し1</h1>
<h2>デモ見出し2</h2>
</hgroup>

このように<hgroup>を使うことで、関連性のある複数レベルの見出しを意味的にひとまとめにできます。ただし、前述の通りW3C仕様からは削除された要素であるため、現在のWeb制作では<header>要素との組み合わせなど、より現代的なマークアップ手法を選択することをおすすめします。

  1. HTMLのembedタグとは？使い方と主な属性をわかりやすく解説

    <embed>タグとは<embed>タグは、HTML文書の中に外部アプリケーションやプラグインコンテンツ（PDFファイル、動画、音声など）を埋め込むための要素です。開始タグのみで構成され、基本的に終了タグは不要です。<embed>タグで使用できる主な属性は以下の通りです。height：埋め込むコンテンツの高さをピクセル単位で指定します。src：埋め込む外部ファイルのアドレス（URL）を指定します。type：埋め込みコンテンツのメディアタイプ（MIMEタイプ）を指定します。例：「application/pdf」など。width：埋め込むコンテンツの幅をピクセル

  2. HTMLの<dfn>タグとは？定義用語のマークアップ方法を実例付きで解説

    HTMLの<dfn>タグは、専門用語や略語など「定義の対象となる語」が文書内で最初に登場する箇所を示すための要素です。多くのブラウザでは、<dfn>タグで囲まれた部分は斜体（イタリック体）で表示されます。 それでは、<dfn>タグの具体的な実装例を見ていきましょう。 コード例 <!DOCTYPE html> <html> <body> <h2>MCAの科目一覧</h2> <p><dfn title="Master of Computer Applications"