list-style-typeプロパティ

値

次のような値を設定することができます。

• disc – 黒丸(初期値)
• circle – 黒縁の白丸
• square – 四角
• decimal – 数字
• decimal-leading-zero – 二桁目に「0」を置いた数字
• lower-roman – 小文字のローマ数字
• upper-roman – 大文字のローマ数字
• lower-greek – ギリシャ語
• lower-latin – 小文字のラテン語（アルファベット）
• upper-latin – 大文字のラテン語（アルファベット）
• armenian – アルメニア語
• geogian – ジョージア語
• lower-alpha – 小文字のアルファベット
• upper-alpha – 大文字のアルファベット
• none – リストアイコンなし

パターン1

「disc」を指定した例です。

CSSコード例

ul {
	list-style-type: disc;
}

表示例：

パターン2

「circle」を指定した例です。

CSSコード例

ul {
	list-style-type: circle;
}

表示例：

パターン3

「square」を指定した例です。

CSSコード例

ul {
	list-style-type: square;
}

表示例：

パターン4

「decimal」を指定した例です。

CSSコード例

ul {
	list-style-type: decimal;
}

表示例：

パターン5

「decimal-leading-zero」を指定した例です。

CSSコード例

ul {
	list-style-type: decimal-leading-zero;
}

表示例：

パターン6

「lower-roman」を指定した例です。

CSSコード例

ul {
	list-style-type: lower-roman;
}

表示例：

パターン7

「upper-roman」を指定した例です。

CSSコード例

ul {
	list-style-type: upper-roman;
}

表示例：

パターン8

「lower-greek」を指定した例です。

CSSコード例

ul {
	list-style-type: lower-greek;
}

表示例：

パターン9

「lower-latin」を指定した例です。

CSSコード例

ul {
	list-style-type: lower-latin;
}

表示例：

パターン10

「upper-latin」を指定した例です。

CSSコード例

ul {
	list-style-type: upper-latin;
}

表示例：

パターン11

「armenian」を指定した例です。

CSSコード例

ul {
	list-style-type: armenian;
}

表示例：

パターン12

「georgian」を指定した例です。

CSSコード例

ul {
	list-style-type: georgian;
}

表示例：

パターン13

「lower-alpha」を指定した例です。

CSSコード例

ul {
	list-style-type: lower-alpha;
}

表示例：

パターン14

「upper-alpha」を指定した例です。

CSSコード例

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

表示例：

パターン15

「none」を指定した例です。リストアイコンに画像を指定したい場合などに使用します。

CSSコード例

ul {
	list-style-type: none;
}

表示例：

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。