最終更新日
ドキュメントやアプリケーションのセクションを表します。section要素のセクションは、主に内容によって区切られる各部分を意味し、通常はh1要素の見出しを中に含みます。section要素は、Flowコンテンツの記述箇所で使用できます。section要素に似た要素として、article要素やdiv要素があります。
section要素を入れ子構造にすることで、h2~h6の要素を使わずにh1要素だけを使って見出しレベルを順序付けすることもできます。ドキュメントの構成が論理的に分割されている場合などに使うと便利でしょう。
HTML5の仕様では、コンテンツ各部の集まりを統合的にまとめて扱う場合はsection要素の代わりにarticle要素を、コンテンツをスタイル化やスクリプト用に分ける場合はsection要素の代わりにdiv要素を、それぞれ使用することを推奨しています。
カテゴリ | タグの省略 | 親要素 | 子要素 |
---|---|---|---|
Flowコンテンツ Sectioningコンテンツ |
省略不可 | Flowコンテンツを子にできる要素 | Flowコンテンツ |
属性 | 値 | 説明 |
---|---|---|
グローバル属性 | - | - |
イベント属性 | - | - |
<body> <h1>レギュラーメニュー</h1> <p>マクドエイドの厳選メニューです。</p> <section> <h1>ハンバーガー</h1> <p>オーストラリア産ビーフを100%使用しています。</p> </section> <section> <h1>チーズバーガー</h1> <p>まろやかでクリーミーなチーズを使用しています。</p> </section> <section> <h1>フィレオフィッシュ</h1> <p>酸味がきいたタルタルソースが白身魚とマッチしています。</p> </section> </body>