第4章　スタイルシートの注意点

4-4.リスト要素の不思議

手始めに文字色の定義

リストには、UL要素、OL要素、DL要素があり、それぞれのリスト表示方法として、LI要素（UL要素、OL要素）やDT、DD要素（DL要素）を使います。

さて、次のような定義をHTMLファイルに適用することを考えてみます。

ul,ol,dl { color : red  }
li,dt,dd { color : blue }

<ul>  <li>UL要素  <li>前にドットがつきます  </ul>

<ol>  <li>OL要素  <li>前に数字がつきます  </ol>

<dl>  <dt>DL要素の中のDT要素  <dd>同じくDD要素  </dl>

この内容を表にしてみました

実際の見栄えを、画像ファイルで表示して比較してみます。

ボーダーを定義すると笑っちゃいます

いっその事、完全に笑えるよう、リスト関係の全ての要素にボーダーを定義してみます。

li,dt,dd { color : blue ; border:2px green  solid;}
ul,ol,dl { color : red  ; border:2px purple solid;}

どこが笑えるかは、次の画像を見てもらえれば分かると思います。

ボーダーやパディングは全ての要素に適用できるはずなんですが、リスト要素に適用するのは現時点ではあきらめた方がよさそうです。なお、IE5でも、ボーダーのかかり方はほとんど変わりませんでした。(99.9.9.追記）

Indexに戻る ==== 前のページに戻る ==== 次のページへ