4-14-2a リスト・順序あり
同じ箇条書きリストでも、リストの頭に数字（1. 2. 3.）が付いている物の作成方法です。先ほどの<ul> 要素を<ol> 要素に変えるだけでOKです。（リストの項目はこちらでも<li> 要素を利用致します）。 ちなみに <ol> 要素もブロックレベル要素です。<ol> タグで囲まれた部分が一つにリストになります。
ちなみに <ol> とは 『Ordered List （順序の有るリスト）』 という意味の略語です。
[ 関連事項 ： HP-TIPS > HPの作り方 > リスト・順序なし ]
4-14-2b 具体例
HTML
<body> ～ </body> 内に記述して下さい。
<h4>簡単ゼリーの作り方<h4>
<ol>
<li>ジュースを温める。</li>
<li>手早く粉ゼラチンを混ぜる。</li>
<li>器に流し込んで冷蔵庫で冷やせば出来上がり。</li>
</ol>
表示結果
簡単ゼリーの作り方
- ジュースを温める。
- 手早く粉ゼラチンを混ぜる。
- 器に流し込んで冷蔵庫で冷やせば出来上がり。
もちろん数字以外の記号も使えます。（順序なしリストで紹介した 「list-style-type: lower-roman ;（小文字のローマ数字）」、「list-style-type: upper-roman ; （大文字のローマ数字）」、「list-style-type: lower-alpha ; （小文字のアルファベット）」、「list-style-type: upper-alpha ;（大文字のアルファベット）」です）
具体的な見本は順序なしリストで紹介した物と同じですので割愛致します。（約10.0KB）
4-14-2c リストの階層化
こちらのリストもそれぞれ階層（入れ子）を作る事が出来ます。階層を作りたい <li> ～ </li> の中に別の <ol> ～ </ol> （もしくは<ul> ～ </ul>）を入れてみて下さい。
HTML
<body> ～ </body> 内に記述して下さい。
<ol>
<li>ルネッサンスの三代巨匠
<ol>
<li>レオナルド・ダ・ヴィンチ
<ul>
<li>受胎告知</li>
<li>最後の晩餐</li>
<li>モナリザ</li>
</ul>
</li>
<li>ミケランジェロ・ヴォナローティ
<ul>
<li>ダヴィデ像</li>
<li>システィーナ礼拝堂天井画</li>
<li>最後の審判</li>
</ul>
</li>
<li>ラファエロ・サンツィオ
<ul>
<li>三美神</li>
<li>アテネの学堂</li>
<li>ガラティアの勝利</li>
</ul>
</li>
</ol>
</li>
</ol>
表示結果
上記のリストをIEとNN、OPERA、Firefoxで表示し、その見た目の違いを画像にしてみました（詳細はこちらから どうぞ［約10.5KBあります］）。順序なしリスト（約3.9KB）と違ってほとんど見た目に変わりは有りませんが、IEとNN、Firefox では階層が深くなったリストの記号が四角（■）になっているのに対して、OPERAでは記号が黒丸（●）になっております。
