トップページ  > HTML Living Standard  > <ol>

★HTML Living Standard リファレンス

<ol> …… 順序のあるリストを表す
Internet Explorer Microsoft Edge Google Chrome Safari Firefox Opera
広告

<ol>タグは、順序のあるリストを表す際に使用します。 ol要素のリスト項目には順序があるため、記述順を変えると文書の意味が変わってしまう可能性があります。

ol要素にreversed属性を指定すると、リストの番号を逆順にします。 start属性は、リストを開始する数値を指定します。 type属性は、リストマーカーの種類を指定します。 いずれの属性も必須ではなく、必要に応じて使用します。

ol要素のtype属性によるリストマーカーの種類の指定は、 リスト項目が番号や文字で参照されるなど、リストマーカーが意味的に重要となる場合です。 リストマーカーの種類はCSSでも指定できますから、 スタイリング目的ならばCSSのlist-style-typeプロパティを使用しても良いでしょう。

■属性

reversed属性
リストの番号を逆順にします。 reversed属性を指定すると、降順リスト(..., 3, 2, 1)になります。 reversed属性を省略すると、昇順リスト(1, 2, 3, ...)になります。
start属性
リストを開始する数値を指定します。 start属性を使用する場合には、有効な整数を指定しなくてはなりません。 初期値は 1 です。
type属性
リストマーカーの種類を指定します。 type属性に指定できる値は、"1"、"a"、"A"、"i"、"I" のいずれかです。 一致する値がない場合やtype属性を省略した場合は、10進数となります。 例えば、ゼロ以下の数値を指定しても10進法となります。
  • 1 を指定すると10進数(1, 2, 3, ...)
  • a を指定すると小文字のアルファベット(a, b, c, ...)
  • A を指定すると大文字のアルファベット(A, B, C, ...)
  • i を指定すると小文字のローマ数字(i, ii, iii, ...)
  • I を指定すると大文字のローマ数字(I, II, III, ...)

■使用例

以下のサンプルは、リスト項目の順序に意味があるので、ol要素を使用しています。

HTMLソース

<p>今までに住んだ国を、住んだ順に紹介します:</p>
<ol>
 <li>スイス
 <li>イギリス
 <li>アメリカ
 <li>ノルウェー
</ol>
↓↓↓

ブラウザ上の表示

今までに住んだ国を、住んだ順に紹介します:

  1. スイス
  2. イギリス
  3. アメリカ
  4. ノルウェー

■使用例

以下のサンプルは、上記サンプルの場合と比べると、リスト項目の最初の2つが入れ替わっています。 リスト項目の順序の変更により、著者の出身国がスイスからイギリスに変わったことになります。

HTMLソース

<p>今までに住んだ国を、住んだ順に紹介します:</p>
<ol>
 <li>イギリス
 <li>スイス
 <li>アメリカ
 <li>ノルウェー
</ol>
↓↓↓

ブラウザ上の表示

今までに住んだ国を、住んだ順に紹介します:

  1. イギリス
  2. スイス
  3. アメリカ
  4. ノルウェー
広告
Sponsors
広告
MuuMuu Domain!
ドメイン取るならお名前.com
現役エンジニアのオンライン家庭教師【CodeCamp】
サイトに広告を掲載してお小遣いが稼げる!【A8.net】
Node.jsコース
はじめてのプログラミングコース
▲ページ先頭へ
HTMLクイックリファレンスについて
© HTMQ