ヘッダーであることを表すには?
headerタグの書式
headerタグに対応しているブラウザ
※Windows 7上で動作確認を行っています。
※ブラウザの設定より、異なる挙動をする場合があります。
headerタグの属性一覧
headerタグの解説
<header>は、「ヘッダー」と呼ばれる、コンテンツのイントロダクションやナビゲーション情報といった情報を表すための要素です。
通常、<h1>-<h6>要素や<hgroup>要素による見出しを含む形でヘッダーを構成することが想定されています。
ただし、これらの見出し要素を含むことは必須ではありません。
例えばセクションの目次、検索フォームあるいはロゴといった用途でも使用することができます。
headerタグのサンプルソース1
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル1</title>
</head>
<body>
<header>
<hgroup>
<h1>地球の温暖化について</h1>
<h2>CO2削減</h2>
</hgroup>
</header>
<p>2020年まで日本ではどれくらいのCO2を削減できるでしょうか。・・・</p>
<footer>
<p><small>無断転載を禁止します。</small></p>
</footer>
</body>
</html>
headerタグのサンプル画面1
headerタグのサンプルソース2
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル2</title>
</head>
<body>
<header>
<h1>航空券のご購入について</h1>
<nav>
<ul>
<li><a href="/seat">空席照会</a>
<li><a href="/charge">料金案内</a>
<li><a href="/reservation">予約案内</a>
</ul>
</nav>
<h2>お知らせ</h2>
<p>11月より「東京~大阪」便を追加しました。</p>
<h2>購入の手続き</h2>
</header>
<p>航空券を手速く購入できます。・・・</p>
<footer>
<p><small>無断転載を禁止します。</small></p>
</footer>
</body>
</html>
headerタグのサンプル画面2
headerタグの関連項目