ol要素 -- 序列リスト

基本データ

ol要素
文書型 適用 子要素 開始タグ 終了タグ 分類
Strict ○ li要素 必須 必須 ブロックレベル要素
Transitional ○
Frameset ○

属性

固有属性

type="マーカーの種類"(非推奨)
Strict: × | Transitional: △ | Frameset: △
リストの先頭につく番号の形式を指定します。利用できるのは次の値です。
1
アラビア数字 (1, 2, 3 …)
a
小文字のアルファベット (a, b, c …)
A
大文字のアルファベット (A, B, C …)
i
小文字のローマ数字 (i, ii, iii …)
I
大文字のローマ数字 (I, II, III …)
この属性は非推奨です。CSSを利用すれば同じことが可能です。
アラビア数字 (1, 2, 3 …)
ol { list-style-type: decimal; }
小文字のアルファベット (a, b, c …)
ol { list-style-type: lower-alpha; }
大文字のアルファベット (A, B, C …)
ol { list-style-type: upper-alpha; }
小文字のローマ数字 (i, ii, iii …)
ol { list-style-type: lower-roman; }
大文字のローマ数字 (I, II, III …)
ol { list-style-type: upper-roman; }
compact(非推奨)
Strict: × | Transitional: △ | Frameset: △
リストをコンパクトに表示します。どのように表示するかはユーザーエージェントに依存します。この属性は非推奨です。
start="開始番号"(非推奨)
Strict: × | Transitional: △ | Frameset: △
リストの番号を何番から開始するか指定します。この属性は非推奨です。

解説

番号つきのリストを表します。リストの並び順に意味があるときはol要素としてマークアップし、並び替えても問題ないものはul要素としてマークアップします。

ol要素の子要素はli要素のみです。1個以上のli要素が現れなければいけません。

<h2>おいしい石焼ビビンバの作りかた</h2>
<ol>
  <li>石焼なべに油を引き、温める。</li>
  <li>ご飯、ナムル、キムチ、そぼろをなどを並べ、中央に卵を盛る。</li>
  <li>パチパチ音がするまで熱する。</li>
  <li>好みに応じてコチュジャンを加える。</li>
</ol>

おいしい石焼ビビンバの作りかた

  1. 石焼なべに油を引き、温める。
  2. ご飯、ナムル、キムチ、そぼろをなどを並べ、中央に卵を盛る。
  3. パチパチ音がするまで熱する。
  4. 好みに応じてコチュジャンを加える。

li要素の中に別のol要素を含めることで、リストを入れ子にすることができます。

<h2>目次</h2>
<ol>
  <li>HTMLの概要
    <ol>
      <li>ハイパーテキストとしてのHTML</li>
      <li>マークアップ言語としてのHTML</li>
    </ol>
  </li>
  <li>HTMLの文法規則
    <ol>
      <li>要素とタグ</li>
      <li>属性</li>
    </ol>
  </li>
</ol>

目次

  1. HTMLの概要
    1. ハイパーテキストとしてのHTML
    2. マークアップ言語としてのHTML
  2. HTMLの文法規則
    1. 要素とタグ
    2. 属性

リストを入れ子にするときに、ol要素直下にol要素を置かないよう注意してください。次の例は間違いです。

<h2>目次</h2>
<ol>
  <li>HTMLの概要</li>
  <ol>
    <li>ハイパーテキストとしてのHTML</li>
    <li>マークアップ言語としてのHTML</li>
  </ol>
  <li>HTMLの文法規則</li>
  <ol>
    <li>要素とタグ</li>
    <li>属性</li>
  </ol>
</ol>

Strict DTDの定義

<!ELEMENT OL - - (LI)+                 -- ordered list -->
<!ATTLIST OL
  %attrs;                              -- %coreattrs, %i18n, %events --
  >

Information

現在の位置