HOME > HTML講座 > リストを表示する(番号付き)

リストを表示する(番号付き)

<ol>、<li>を使って番号付きのリスト表示をすることができます。

例

<ol>
<li>１つの目のリストです。</li>
<li>２つの目のリストです。</li>
<li>３つの目のリストです。</li>
</ol>

結果

１つの目のリストです。
２つの目のリストです。
３つの目のリストです。

また、type属性を指定すると、番号を変えることができます。
type属性には、"1"、"a"、"A"、"i"、"I"が指定できます。

例

<ol type="1">
<li>１つの目のリストです。type属性は"1"です。</li>
<li>２つの目のリストです。type属性は"1"です。</li>
</ol>

<ol type="a">
<li>１つの目のリストです。type属性は"a"です。</li>
<li>２つの目のリストです。type属性は"a"です。</li>
</ol>

<ol type="A">
<li>１つの目のリストです。type属性は"A"です。</li>
<li>２つの目のリストです。type属性は"A"です。</li>
</ol>

<ol type="i">
<li>１つの目のリストです。type属性は"i"です。</li>
<li>２つの目のリストです。type属性は"i"です。</li>
</ol>

<ol type="I">
<li>１つの目のリストです。type属性は"I"です。</li>
<li>２つの目のリストです。type属性は"I"です。</li>
</ol>

結果

１つの目のリストです。type属性は"1"です。
２つの目のリストです。type属性は"1"です。

１つの目のリストです。type属性は"a"です。
２つの目のリストです。type属性は"a"です。

１つの目のリストです。type属性は"A"です。
２つの目のリストです。type属性は"A"です。

１つの目のリストです。type属性は"i"です。
２つの目のリストです。type属性は"i"です。

１つの目のリストです。type属性は"I"です。
２つの目のリストです。type属性は"I"です。

まとめ

<ul>、<li>で、番号付きのリスト表示ができる。
type属性を指定すると、番号を変えることができる。

リストを表示する(番号付き)

例

結果

例

結果

まとめ

関連リンク