CSS: リスト(ul , ol 要素)のマークの種類を指定する

CSS でリスト(ul, ol 要素)のマークの種類を指定する場合は、 list-style-type プロパティを指定します。初期値は黒丸です。

使用例


ul {
    list-style-type: square;  /* 四角 */
}

指定できる値には次のような値があります。

説明
noneマークなし
disc● 黒丸(初期値)
circle○ 白丸
square■ 四角
decimal1,2,3... (10進数)
decimal-leading-zero01, 02, 03...99 (頭に0ありの10進数)
lower-roman小文字ローマ字
lower-greek小文字ギリシャ文字
lower-alpha小文字アルファベット
upper-alpha大文字アルファベット

list-style-type プロパティと同時に、list-style-image プロパティが指定されている場合は、 list-style-image プロパティが優先されます。

マークの表示例

以下の4つは ul 要素に対して指定しています。

  • none
  • none

  • disc
  • disc

  • circle
  • circle

  • square
  • square

以下は ol 要素に対して指定しています。

  1. decimal
  2. decimal

  1. decimal-leading-zero
  2. decimal-leading-zero

  1. lower-roman
  2. lower-roman

  1. lower-greek
  2. lower-greek

  1. lower-alpha
  2. lower-alpha

  1. upper-alpha
  2. upper-alpha

HTML・CSS入門