スタイルシート［CSS］/リスト/マーカーの種類を指定する

list-style-type: ***;

ブラウザ
プロパティ	list-style-type

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

このプロパティは、ul要素、ol要素、li要素の他、displayプロパティで list-item を指定した要素に設定することができます。


ul {
list-style-type: square;
}

ol {
list-style-type: upper-alpha;
}

マーカーの種類

list-style-type: ***　（*** の部分に以下の値を指定します）

プロパティ名	値	説明	表示例
`list-style-type` ［CSS 1］	`none`	マーカーを表示しない	リスト項目リスト項目リスト項目
	`disc`	黒丸	リスト項目リスト項目リスト項目
	`circle`	白丸	リスト項目リスト項目リスト項目
	`square`	四角	リスト項目リスト項目リスト項目
	`decimal`	数字	リスト項目リスト項目リスト項目
	`upper-alpha`	大文字アルファベット	リスト項目リスト項目リスト項目
	`lower-alpha`	小文字アルファベット	リスト項目リスト項目リスト項目
	`upper-roman`	大文字ローマ数字	リスト項目リスト項目リスト項目
	`lower-roman`	小文字ローマ数字	リスト項目リスト項目リスト項目
［CSS 2］	`decimal-leading-zero`	2桁の数字	リスト項目リスト項目リスト項目
	`lower-greek`	小文字ギリシャ文字	リスト項目リスト項目リスト項目
	`upper-latin`	大文字ラテン文字	リスト項目リスト項目リスト項目
	`lower-latin`	小文字ラテン文字	リスト項目リスト項目リスト項目
	`hebrew`	ヘブライ数字	リスト項目リスト項目リスト項目
	`armenian`	アルメニア数字	リスト項目リスト項目リスト項目
	`georgian`	グルジア数字	リスト項目リスト項目リスト項目
	`cjk-ideographic`	漢数字	リスト項目リスト項目リスト項目
	`hiragana`	ひらがな	リスト項目リスト項目リスト項目
	`katakana`	カタカナ	リスト項目リスト項目リスト項目
	`hiragana-iroha`	いろは	リスト項目リスト項目リスト項目
	`katakana-iroha`	イロハ	リスト項目リスト項目リスト項目

［CSS 1］の9種類は多くのブラウザで対応していますが、［CSS 2］の12種類は一部のブラウザでしか対応していません。
［CSS 2］の対応状況は、Firefox、Safari、Chromeは全てに対応、IE 8とOperaは一部に対応、IE 7以下は全て未対応となります。

使用例


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>文書のタイトル</title>

<style type="text/css">

ul { list-style-type: square; }
ol { list-style-type: upper-alpha; }

</style>

</head>
<body>

<ul>
<li>リスト項目A</li>
<li>リスト項目B</li>
<li>リスト項目C</li>
</ul>

<ol>
<li>リスト項目1</li>
<li>リスト項目2</li>
<li>リスト項目3</li>
</ol>

</body>
</html>

表示例

リスト項目A
リスト項目B
リスト項目C

リスト項目1
リスト項目2
リスト項目3

マーカーの種類

使用例

カテゴリー