WEBページ作成リファレンス
cman.jp cman.jp > WEBページ作成TOP > HTMLタグ・リファレンス > HTMLタグ一覧(ABC順) > <section>「文書内セクション」

<section> 「文書内セクション」[読み方:セクション]

<section>タグは、文書内の一般的なセクションを表します。意味や機能のひとまとまりをセクションとし、通常は<section>タグ内に見出し<h1~h6>を指定します。<section>は入子にする事が出来ます。

HTML規格HTML4.01HTML5
使用可否×
<section>は、HTML5で追加されたタグです
ブラウザ別の対応状況
下記サイトで確認できます。
「Can I use」(英語のサイトです)
広告

<section> の仕様

カテゴリー使用できる場所(親要素)コンテンツモデル(子要素)タグ省略
フローコンテンツ
セクショニングコンテンツ
フローコンテンツを子要素にもてる場所フローコンテンツ不可

<section> の属性

【構文】
<section>~内容~</section>
属性意味値のサンプルなど
---
グローバル属性
  • accesskey
  • autocapitalize
  • autofocus
  • class
  • contenteditable
  • dir
  • draggable
  • enterkeyhint
  • hidden
  • id
  • inert
  • inputmode
  • is
  • itemid
  • itemprop
  • itemref
  • itemscope
  • itemtype
  • lang
  • nonce
  • popover
  • slot
  • spellcheck
  • style
  • tabindex
  • title
  • translate
  • writingsuggestions
イベント属性
ページTOP

<section>タグのサンプル

ブログのサンプル
<article>
  <h4>箱根でゆっくり温泉</h4>
  <p>(<time datetime="2013-03-24T20:15">2013/03/24 20:15</time>)</p>
  <p>週末、家族と愛犬で温泉に行ってきました。~内容~</p>

  <section>
    <h5>ひろしさんのコメント</h5>
    <p>楽しそうな写真ですね
      (<time datetime="2013-03-24T22:03">2013/03/24 22:03</time>)</p>
  </section>

  <section>
    <h5>はなこさんのコメント</h5>
    <p>私も来月にでも行こうかな・・
      (<time datetime="2013-03-25T10:48">2013/03/25 10:48</time>)</p>
  </section>

</article>

箱根でゆっくり温泉

週末、家族と愛犬で温泉に行ってきました。~内容~ 

ひろしさんのコメント

楽しそうな写真ですね (

はなこさんのコメント

私も来月にでも行こうかな・・ (

ページTOP

留意事項

  • <section>タグは、より具体的な意味を持つタグ(<article><aside><nav>など)が適していない場合に使用します。
  • レイアウト目的の場合、<section>タグは使用せず、<div>タグの使用が推奨されます。
  • <section>タグを入れ子にすることで、<h2>~<h6>タグを使用せずに<h1>タグのみで見出しの順序づけが可能です。
ページTOP
広告
QrCode
このページのURL
スマートフォン・タブレット運営 : CMAN 株式会社シーマン