<header> - ヘッダ

• トップ
• HTMLリファレンス
• <header>

• 概要
• 説明
• 属性
• 使用例
• 詳細
  • >header 要素の入れ子
• 関連項目
• リンク

概要

形式

<header>～</header>

サポート

https://caniuse.com/mdn-html_elements_header

カテゴリ

フローコンテンツ

パルパブルコンテンツ

親要素

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

子要素

フローコンテンツ (ただし、header, footer, title, main要素を子孫として持つことはできない)

タグの省略

開始タグ:必須 / 終了タグ:必須

属性

グローバル属性

説明

文書の中でヘッダとなる情報を記述します。ヘッダには、タイトル、目次、検索フォーム、ロゴなどが含まれます。

header 要素が区分コンテンツ (<article>, <aside>, <nav>, <section>) に含まれる場合は区分コンテンツのヘッダ情報であることを示します。

属性

グローバル属性

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

使用例

<article>
  <header>
    <h1>HTML5最終勧告に対応しました</h1>
    <time datetime="2015-01-04 12:45+09:00">2015/01/04 12:45</time>
  </header>
  <p>...</p>
  <footer>
    <div>Posted by T. Yamada</div>
  </footer>
</article>

詳細

>header 要素の入れ子

HTML5 では、header や footer 要素を入れ子にすることは禁じられていましたが、HTML 5.1 では区分コンテンツ (article, aside, nav, section) で階層化されている場合には、header や footer 要素を入れ子にすることが可能となりました。

<article>
  <header>
    <h1>...</h1>
    <aside>
      <header>
        <h2>...</h2>
        <p><...</p>
      </header>
      <p>...</p>
    </aside>
  </header>
  <p>...</p>
</article>

関連項目

• <footer>

リンク

• https://html.spec.whatwg.org/multipage/sections.html#the-header-element
• https://developer.mozilla.org/ja/docs/Web/HTML/Element/header
• https://caniuse.com/mdn-html_elements_header