<ol></ol> <li></li>

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類
要素

ol要素で、番号付きのリストを作成することができます。リストの項目は、ol要素内に配置するli要素で示します。

一般的なブラウザでは、リストの左側がインデントされて表示されます。


<ol>
<li>リスト項目1</li>
<li>リスト項目2</li>
<li>リスト項目3</li>
</ol>

リストの入れ子

リストに階層を持たせたい場合は、次のようにli要素の中に別のol要素を配置します。

<ol>
<li>リスト項目1</li>
<li>リスト項目2

<ol>
<li>リスト項目2-1</li>
<li>リスト項目2-2</li>
<li>リスト項目2-3</li>
</ol>

</li>
<li>リスト項目3</li>
</ol>

次のように、ul要素（順不同のリスト）を入れ子にすることもできます。

<ol>
<li>リスト項目1</li>
<li>リスト項目2

<ul>
<li>リスト項目2-A</li>
<li>リスト項目2-B</li>
<li>リスト項目2-C</li>
</ul>

</li>
<li>リスト項目3</li>
</ol>

使用例


<ol>
<li>リスト項目1</li>
<li>リスト項目2</li>
<li>リスト項目3</li>
</ol>
表示例
  1. リスト項目1
  2. リスト項目2
  3. リスト項目3
ol要素を入れ子にした例

<ol>
<li>リスト項目1</li>
<li>リスト項目2

<ol>
<li>リスト項目2-1</li>
<li>リスト項目2-2</li>
<li>リスト項目2-3</li>
</ol>

</li>
<li>リスト項目3</li>
</ol>
表示例
  1. リスト項目1
  2. リスト項目2
    1. リスト項目2-1
    2. リスト項目2-2
    3. リスト項目2-3
  3. リスト項目3
ul要素を入れ子にした例

<ol>
<li>リスト項目1</li>
<li>リスト項目2

<ul>
<li>リスト項目2-A</li>
<li>リスト項目2-B</li>
<li>リスト項目2-C</li>
</ul>

</li>
<li>リスト項目3</li>
</ol>
表示例
  1. リスト項目1
  2. リスト項目2
    • リスト項目2-A
    • リスト項目2-B
    • リスト項目2-C
  3. リスト項目3