list-style-type（リストスタイルのタイプ）

解説

リストの先頭に表示するマークを指定する属性です。
HTMLにおけるliエレメントのtypeアトリビュートと同じ効果。

値	disc：黒丸 circle：白丸 square：四角 decimal：１０進数（1,2,3,...） decimal-leading-zero：0付き１０進数（01,02,03,...98,99） lower-roman：小文字ローマ数字(i,ii,iii,iv,...) upper-roman：大文字ローマ数字(I,II,III,IV,...) lower-greek：小文字ギリシャアルファベット(α,β,γ,...) lower-alpha：小文字アルファベット(a,b,c,...z) lower-latin：小文字アルファベット(a,b,c,...z) upper-alpha：大文字アルファベット(A,B,C,...Z) upper-latin：大文字アルファベット(A,B,C,...Z) hebrew：ヘブライ数字 armenian：アルメニア数字 georgian：グルジア数字(an,ban,gan,...,he,tan,in,in-an,...) cjk-ideographic：表意文字の数字 hiragana：あ,い,う,え,お,... katakana：ア,イ,ウ,エ,オ,... hiragana-iroha：い,ろ,は,に,ほ,へ,と,... katakana-iroha：イ,ロ,ハ,ニ,ホ,ヘ,ト,... none：マーク無し
初期値	disc
%値の基準
適用	display属性の値がlist-itemのエレメント（リストアイテムエレメント）
継承	する

対応状況

disc

circle

square

decimal

lower-roman

upper-roman

lower-alpha

upper-alpha

その他

none

使用例

ソース

表示＆操作

スタイル部に、

.disc{list-style-type:disc;}
.circle{list-style-type:circle;}
.square{list-style-type:square;}
.decimal{list-style-type:decimal;}
.lower-roman{list-style-type:lower-roman;}
.upper-roman{list-style-type:upper-roman;}
.lower-alpha{list-style-type:lower-alpha;}
.upper-alpha{list-style-type:upper-alpha;}
.none{list-style-type:none;}
.hiragana{list-style-type:hiragana;}

と記述し、

黒丸

白丸

四角

１０進数

小文字ローマ数字

大文字ローマ数字

小文字アルファベット

大文字アルファベット

マーク無し

あいうえお

と表示されます。

body部に、

<ul class="disc"><li>黒丸</ul>
<ul class="circle"><li>白丸</ul>
<ul class="square"><li>四角</ul>
<ul class="decimal"><li>１０進数</ul>
<ul class="lower-roman"><li>小文字ローマ数字</ul>
<ul class="upper-roman"><li>大文字ローマ数字</ul>
<ul class="lower-alpha"><li>小文字アルファベット</ul>
<ul class="upper-alpha"><li>大文字アルファベット</ul>
<ul class="none"><li>マーク無し</ul>
<ul class="hiragana"><li>あいうえお</ul>

と記述すると。

pokochan@mx1.tees.ne.jp