リスト要素

リスト要素とは

リスト要素はその名のとおり、リストを意味するグループ化を行う要素です。

リストには主に順序付けを行わないリストグループを作成するul要素と、順番付けを行うリストグループを作成するol要素が使用できます。

リストの各項目はli要素を使用します。

リストのネスト(リストの中にリストを入れる)ことも可能で、その場合はli要素の中にul要素やol要素を記述します。

ul要素

ul要素は順序付けを行わない(番号なしの)リストを作成します。

多くの視覚系ブラウザのデフォルトでは各項目の始まりに"・"が挿入され、各項目の終わりに改行が挿入されますが、スタイルシートによってカスタマイズ可能です。

このサイトのインデックスページを除く各ページの終わりに使用している"戻る"や"トップページ"、"進む"の部分にもこのリストを使用しています。

ol要素

ol要素では順序付けを行う(番号つきの)リストを作成します。

多くの視覚系ブラウザのデフォルトではul要素で"・"だったものが、数字+.になるようですが、これもスタイルシートによってカスタマイズ可能です。

li要素

li要素ではリストの各項目を作成しますが、各項目の終了が明らかなので閉じタグが省略できます。

多重のリスト(リストの中にリスト)を作成したい場合はこの要素の中にul要素やol要素を記述しますが、この場合閉じタグを省略すると読みにくくなるので省略しないほうが良いでしょう。

それ以外の場合は省略したほうが見やすくなると思います。

サンプル

<ul>
<li>項目1
<li>項目2
<li>項目3
</ul>

<ol>
<li>項目1
<li>項目2
<li>項目3
</ol>

<ul>
<li>1つめの要素
 <ul>
 <li>こんな感じに
 <li>リストの中のリストも
 <li>可能
 </ul>
</li>
<li>2つめの要素
 <ol>
 <li>ulの中にolや
 <li>逆も可能
 </ol>
</li>
</ul>

このようにすると以下のようにレンダリングされます。

  1. 項目1
  2. 項目2
  3. 項目3