From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/html/element/section/index.html | 128 +++++++++++++++++++++++++++ 1 file changed, 128 insertions(+) create mode 100644 files/ja/web/html/element/section/index.html (limited to 'files/ja/web/html/element/section/index.html') diff --git a/files/ja/web/html/element/section/index.html b/files/ja/web/html/element/section/index.html new file mode 100644 index 0000000000..6c8e43f38f --- /dev/null +++ b/files/ja/web/html/element/section/index.html @@ -0,0 +1,128 @@ +--- +title: '
: 汎用セクション要素' +slug: Web/HTML/Element/section +tags: + - HTML + - HTML セクション + - 'HTML:フローコンテンツ' + - 'HTML:区分コンテンツ' + - 'HTML:知覚可能コンテンツ' + - Reference + - ウェブ + - 要素 +translation_of: Web/HTML/Element/section +--- +
{{HTMLRef}}
+ +

HTML の <section> 要素は、 HTML 文書の中で単独のセクション (区間) を表します。セクションを表現するより意味的に具体的な要素がない場合に使用します。必ずではありませんが、通常はセクションには見出しがあります。

+ +
{{EmbedInteractiveExample("pages/tabbed/section.html", "tabbed-standard")}}
+ + + +

例えば、ナビゲーションメニューは {{htmlelement("nav")}} 要素で表しますが、検索結果の一覧や地図の表示やコントロールには具体的な要素がないので、 <section> の中に入れることができます。

+ +
+

メモ: 要素の内容が個別の記事をまとめたものであれば、 {{HTMLElement("article")}} 要素がより適しているかもしれません。

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
コンテンツカテゴリフローコンテンツ, 区分コンテンツ, 知覚可能コンテンツ
許可されている内容フローコンテンツ
タグの省略{{no_tag_omission}}
許可されている親要素フローコンテンツを受け入れるすべての要素。ただし、 <section> 要素は {{HTMLElement("address")}} 要素の子孫要素として配置してはならない。
許可されている ARIA ロール{{ARIARole("alert")}}, {{ARIARole("alertdialog")}}, {{ARIARole("application")}}, {{ARIARole("banner")}}, {{ARIARole("complementary")}}, {{ARIARole("contentinfo")}}, {{ARIARole("dialog")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("log")}}, {{ARIARole("main")}}, {{ARIARole("marquee")}}, {{ARIARole("navigation")}}, {{ARIARole("search")}}, {{ARIARole("status")}}, {{ARIARole("tabpanel")}}
DOM インターフェイス{{domxref("HTMLElement")}}
+ +

属性

+ +

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

+ +

使用上の注意

+ + + +

例

+ +

導入前

+ +
<div>
+  <h1>Heading</h1>
+  <p>Bunch of awesome content</p>
+</div>
+ +

導入後

+ +
<section>
+  <h1>Heading</h1>
+  <p>Bunch of awesome content</p>
+</section>
+
+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('HTML WHATWG', 'sections.html#the-section-element', '<section>')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5.1', 'sections.html#the-section-element', '<section>')}}{{Spec2('HTML5.1')}}
{{SpecName('HTML5 W3C', 'sections.html#the-section-element', '<section>')}}{{Spec2('HTML5 W3C')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("html.elements.section")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf