| プロパティ名 | 値 | 適用対象 | 継承 |
|---|---|---|---|
| list-style: | リスト関連のプロパティの値 | li要素 | 有り |
| 値 | 説明 | |
|---|---|---|
| リスト関連のプロパティの値 | list-style-typeプロパティの値 | 記号の種類 |
| list-style-imageプロパティの値 | 画像 | |
| list-style-positionプロパティの値 | 表示位置 |
list-styleプロパティを使用すると、list-style-typeプロパティ、list-style-imageプロパティ、list-style-positionプロパティで指定する3つの値をまとめて指定することが出来ます。3つのプロパティの値を任意の順番で並べて、半角スペースで区切って指定します。省略して値は、デフォルトの値が適用されます。list-style-typeとlist-style-imageプロパティの両方の値を指定したときは、list-style-imageプロパティに指定した画像ファイルの値が優先されます。
サンプルソース
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<style type="text/css">
<!--
ul {list-style:inside url("../img/rist02.gif") square;
color:blue;
font-size:1.5em;}
li {background-color:#00FFFF;}
.red {color:red}
-->
</style>
</head>
<body>
<ul>
<li>
list-styleプロパティを使用すると、リスト関連の値を一度に設定出来ます。
list-styleの値「square」は、画像が表示されない時に利用されます。
<span class="red">「 設定例・・ul{ list-style : inside url("../img/rist02.gif") square; ）} 」</span>
値と値は、半角スペースで区切って指定します。
</li>
</ul>
</body>
</html>
