最終更新日

list-style-typeプロパティ

list-style-typeは、リストの先頭に表示するマーカーの種類を指定するプロパティです。

CSS3では、マーカーの種類として、@counter-styleで作成した独自のマーカーを指定することもできます。

list-style-imageが指定されている場合、その値は、list-style-typeの値よりも優先されます。

リスト関連のプロパティをまとめて指定する場合は、list-styleを使用します。

CSS3での変更点
・@counter-styleで作成した独自マーカーを指定できるようになりました。
初期値 適用先 継承
disc display: list-item;」を指定された要素 あり
説明
none マーカーなし。マーカーの領域はそのまま確保され、インデントされた状態で表示されます。
disc 黒い丸(初期値
circle 白い丸
square 黒い四角
decimal 数字
decimal-leading-zero 先頭に0をつけた数字
lower-roman 小文字のローマ数字
upper-roman 大文字のローマ数字
lower-greek 小文字のギリシャ文字
lower-latin 小文字のアルファベット
lower-alpha 小文字のアルファベット
upper-latin 大文字のアルファベット
upper-alpha 大文字のアルファベット
armenian アルメニア数字
georgian グルジア数字
hebrew ヘブライ数字
cjk-ideographic 漢数字
hiragana あいうえお順
katakana アイウエオ順
hiragana-iroha いろはにほへと順
katakana-iroha イロハニホヘト順
サンプルコード
list-style-type: none;
list-style-type: disc;
list-style-type: circle;
list-style-type: square;
list-style-type: decimal;
list-style-type: decimal-leading-zero;
list-style-type: lower-roman;
list-style-type: upper-roman;
list-style-type: lower-greek;
list-style-type: lower-latin;
list-style-type: lower-alpha;
list-style-type: upper-latin;
list-style-type: upper-alpha;
list-style-type: armenian;
list-style-type: georgian;
list-style-type: hebrew;
list-style-type: cjk-ideographic;
list-style-type: hiragana;
list-style-type: katakana;
list-style-type: hiragana-iroha;
list-style-type: katakana-iroha;
参考文献:CSS Lists and Counters Module Level 3外部リンク
HOME