ヘッダーの範囲を示す

11/22/2018

HTML入門

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

/*ヘッダーの範囲を示す記述*/
<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要素を記述した文書をブラウザで表示させた例です。

header要素を使った例
header要素を使った例
メモ

header要素とhead要素を混同しないようにしよう。head要素は、HTML文書の基本要素の1つで、文書に関する情報を表すための要素。

参考:HTML文書に必要な要素

Posted by kiri