目次に戻る

ol要素:HTML Living Standard各要素別メモ

概要

カテゴリー
配置できる場所
内容モデル
属性
  • グローバル属性
  • reversedブーリアン属性降順リストである場合に指定する。
  • start→最初のリスト項目の順序番号を示す整数デフォルトは、reversed属性がある場合は子要素たるli要素の個数、そうでない場合は1
  • type1aAiIリストマーカーの種類を指定する。デフォルト1
HTML構文におけるタグの省略
  • 省略不可。
WAI-ARIA
  • デフォルトroleは、listデフォルトroleは、role属性値に指定すべきでない。
  • デフォルトrole以外では、directorygrouplistboxmenumenubarradiogrouptablisttoolbartreepresentationnoneを指定可。
  • リストマーカーが削除されたら、一部のユーザーエージェントは、デフォルトroleからlistを削除することがある。その場合、もし必要ならば、それを回復するために、rolelistを指定することができる。
視覚系ブラウザデフォルトとして期待されるCSS

  ol {
    display: block;
    unicode-bidi: isolate;
    margin-block-start: 1em;
    margin-block-end: 1em;
    padding-inline-start: 40px;
    list-style-type: decimal;
  }

  :is(dl,menu,ol,ul) ol {
    margin-block-start: 0;
    margin-block-end: 0;
  }

  ol[type=1 s] {list-style-type: decimal;}
  ol[type=a s] {list-style-type: lower-alpha;}
  ol[type=A s] {list-style-type: upper-alpha;}
  ol[type=i s] {list-style-type: lower-roman;}
  ol[type=I s] {list-style-type: upper-roman;}
  
ユーザーエージェントに対する特記事項
  • reversed属性及びstart属性の指定によって)順序数が0以下になるリスト項目が出てきた場合は、当該リスト項目リストマーカーは、type属性による指定にかかわらず、10進数方式とすべきである。
意味・用法

順序が変わったら意味合いが変わってしまうような、意図的に順序付けられたリストを表す。

私見・補足

順序はどうでもよい場合は、ul要素を用いる。

リスト見出しなどをつける方法は、ul要素と同様なので、そちらを参照。

表示確認

ソース

  成績順位最下位(100位)から5人の名前
  <ol reversed="reversed" start="100">
      <li>百番太郎</li>
      <li>九九次郎</li>
      <li>九八花子</li>
      <li>九七丸男</li>
      <li>九六裕子</li>
  </ol>
  
表示結果
成績順位最下位(100位)から5人の名前
  1. 百番太郎
  2. 九九次郎
  3. 九八花子
  4. 九七丸男
  5. 九六裕子

reversed属性に未対応の場合は、リストマーカーが逆順にならない。

IE6表示のスクリーンショット
IE6表示:reversed属性に対応してないため、マーカー数字が逆順ではなく普通の順番になっている

IE7からIE11も同様。