ヘッダーの範囲を示す

04/30/2021HTML

1. ヘッダーの範囲を示す要素
- 1.1. ヘッダーの範囲を示した例
2. Recommended books

ヘッダーの範囲を示す要素

/*ヘッダーの範囲を示す記述*/
<header>ここにヘッダー要素が表されます</header>

header要素は、それを含む最も近いセクションまたはセクショニングルートのヘッダーを表します。

たとえば、最も近い要素がbody要素（セクショニングルート）であった場合、そのヘッダーは文書全体のヘッダーになります。

セクショニングルート｜見出しを表す

ヘッダーの範囲を示した例

header要素を使ってヘッダーの範囲を示した例です。

例では、文書の見出し（h1要素）やリンクのグループ（nav要素）が、header要素で囲まれています。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>会社案内｜○×株式会社</title>
</head>
<body>
<header>
<h1>会社案内</h1>
<nav>
  <ul>
    <li><a href="~">ホーム</a></li>
    <li><a href="~">会社概要</a></li>
    <li><a href="~">製品情報</a></li>
    <li><a href="~">お問い合わせ</a></li>
	</ul>
</nav>
</header>
</body>
</html>

ヘッダーの範囲をを示すheader要素を記述した文書をブラウザで表示させた例です。