list-style-type プロパティ …リストの記号を指定する

使用プロパティ

	list-style-type: 値;
対象となる要素	リストの項目	継承	する
値	次項（値と働き）を参照してください。また、値に対応するブラウザは（ブラウザの対応状況）で確認してください。

解説 list-style-type プロパティを使えば、リストの前に付くリストマーク（行頭記号）の種類を変更することができます。値はすべてのブラウザに対応しているわけではないので注意が必要です。対応するブラウザは「ブラウザの対応状況」で確認してください。リスト関連のプロパティをまとめて指定したい場合は、list-style プロパティを使用します。

値(読み)	値の効果	表示例
none (ナン)	行頭に付く記号を表示しない	リスト
disc (ディスク)	塗りつぶされた丸	リスト
circle (サークル)	中が白い丸	リスト
square (スクエア)	塗りつぶされた四角	リスト
decimal (デシマル)	数字	リスト
decimal-leading-zero (デシマルリーディングゼロ)	頭に0 を付けた数字	01. リスト
lower-roman (ローワーローマン)	小文字のローマ数字	リスト
upper-roman (アッパーローマン)	大文字のローマ数字	リスト
lower-alpha (ローワーアルファ)	小文字のアルファベット	リスト
upper-alpha (アッパーアルファ)	大文字のアルファベット	リスト
lower-latin (ローワーラテン)	小文字のラテン語 lower-alphaと同じ	リスト
upper-latin (アッパーラテン)	大文字のラテン語 upper-latinと同じ	リスト
lower-greek (ローワーグリーク)	小文字のギリシア文字	α. リスト
hebrew (へブルー)	ヘブライ文字の数字	. リスト
georgian (ジョージアン)	グルジア文字の数字	. リスト
armenian (アルメニアン)	アルメニア文字の数字	. リスト
cjk-ideographic (シージェイケイイデオグラフィック)	漢数字	一. リスト
hiragana (ヒラガナ)	ひらがな	あ. リスト
katakana (カタカナ)	カタカナ	ア. リスト
hiragana-iroha (ヒラガナイロハ)	ひらがなのいろは順	い. リスト
katakana-iroha (カタカナイロハ)	カタカナのいろは順	イ. リスト

値	IE 6.0 Win	FireFox Win	Netscape 7.1	Opera	Safari	FireFox Mac	IE Mac
none	○	○	○	○	○	○	○
disk	○	○	○	○	○	○	○
circle	○	○	○	○	○	○	○
square	○	○	○	○	○	○	○
decimal	○	○	○	○	○	○	○
decimal-leading-zero	×	○	○	○	×	○	×
lower-roman	○	○	○	○	○	○	○
upper-roman	○	○	○	○	○	○	○
lower-alpha	×	○	○	○	○	○	○
upper-alpha	×	○	○	○	○	○	○
lower-latin	×	○	○	○	○	○	×
upper-latin	×	○	○	○	○	○	×
lower-greek	×	○	○	○	○	○	×
hebrew	×	○	○	×	×	○	×
georgian	×	○	×	○	×	○	×
armenian	×	○	○	○	×	○	×
cjk-ideographic	×	○	○	×	×	○	×
hiragana	×	○	○	×	×	○	×
katakana	×	○	○	×	×	○	×
hiragana-iroha	×	○	○	×	×	○	×
katakana-iroha	×	○	○	×	×	○	×

記述例
<html> <head> <title>HOME PAGE ZERO ガイド</title> <!--スタイルシート--> <style type="text/css"> ul.sample1 { list-style-type: disc; } ol.sample2 { list-style-type: upper-roman; } </style> </head> <!--ページの本文--> <body> <p>disc 「黒丸」</p> <ul class="sample1"> <li>赤</li> <li>緑</li> <li>青</li> </ul> <p>upper-roman 「大文字のローマ数字」</p> <ol class="sample2"> <li>赤</li> <li>緑</li> <li>青</li> </ol> </body> </html>

[ブラウザでの表示例]
HOME PAGE ZERO ガイド
disc 「黒丸」赤緑青 upper-roman 「大文字のローマ数字」赤緑青

関連情報ページ
ホームページ作成前に知っておくこと HTMLファイル作成の流れ！ CSSをHTMLに適応させる三つの方法 CSS一覧プロパティ辞典 -リスト関連-	HTMLについて CSSについてタグにクラス名を付ける

ゼロから始めよう！わかりやすい！ホームページ作成ガイド