list-style プロパティ
list-style プロパティは、<ul> エレメントといったリストのマーカーに関するlist-style-type、list-style-position、list-style-image プロパティを一括で指定するプロパティです。
ul{
list-style: cjk-ideographic inside url('../img/example_image.gif');
}
もしもリストのマーカーを表示したくなければ、line-style: none; と指定します。
ul{
list-style: none;
}
list-style プロパティは以下のプロパティを一括指定できます。
0付きの番号を表示するには、list-style-type: decimal-leading-zero; で指定します。
ul{
list-style: decimal-leading-zero;
}
ページ内 Index
構文(Syntax)
CSS
list-style: list-style-type list-style-position list-style-image | initial | inherit;
DOM ( JavaScript )
String = object.style.listStyle;
object.style.listStyle="list-style-type list-style-position list-style-image | initial | inherit";
値(Values)
| Value | 摘要 |
|---|---|
| list-style-type | マーカーのフォント |
| list-style-position | マーカーの位置 |
| list-style-image | 画像を表示 |
| initial | 初期値に戻す |
| inherit | 親エレメントのプロパティを継承 |
備考(Remarks)
| 初期値(Default value) | disc outside none |
| 継承(Inherited) | Yes |
| CSS Animation | No |
Example
list-styleの例です。上にデフォルトの状態(値はoutside)のリスト。下にlist-styleを指定した状態を表示しています。
list-style-imageでのイメージが読み込めないときは、list-style-typeの指定で表示されます。
下のリストは、マーカーをイメージで、リストを内側に表示しています。
アイコンはICOOON MONOから利用させていただきました。
