HTML の <header> 要素は、導入的なコンテンツ、特に導入部やナビゲーションの等のグループを表します。見出しを含む以外に、ロゴ、検索フォーム、作者名なども含めることができます。

コンテンツカテゴリ フローコンテンツ, 知覚可能コンテンツ
許可されている内容 フローコンテンツ。但し、子孫に他の <header><footer> がないこと。
タグの省略 不可。開始と終了タグの両方が必要。
許可されている親要素 フローコンテンツを受け入れるすべての要素。ただし、<address><footer>、他の <header> 要素の子孫要素として配置してはなりません。
許可されている ARIA ロール group, presentation
DOM インターフェイス HTMLElement

使用上の注意

<header> 要素は区分コンテンツではありません。つまり、この要素が新たなアウトラインを生成することはありません。すなわち header 要素は通常、自身を囲む section の見出し (h1h6 要素) を含むことを意図していますが、必須ではありません

属性

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

<header>
  <h1>Main Page Title</h1>
  <img src="mdn-logo-sm.png" alt="MDN logo">
</header> 

メインページのタイトル

MDN

記事のヘッダー

<article>
  <header>
    <h2>The Planet Earth</h2>
    <p>Posted on Wednesday, 4 October 2017 by Jane Smith</p>
  </header>
  <p>We live on a planet that's blue and green, with so many things still unseen.</p>
  <p><a href="https://janesmith.com/the-planet-earth/">Continue reading....</a></p>
</article>

仕様書

仕様書 状態 備考
HTML Living Standard
<header> の定義
現行の標準  
HTML5
<header> の定義
勧告  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
基本対応Chrome 完全対応 5Edge 完全対応 ありFirefox 完全対応 4IE 完全対応 9Opera 完全対応 11.1Safari 完全対応 4.1WebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 11Safari iOS 完全対応 4.2Samsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, yyss, ethertank
最終更新者: mfuji09,