ホームページ作成の基礎からご提供するホームページ作成Space

後述の list-style-type, list-style-image, list-style-position を一度に指定します。

LI { list-style: disc inside; }

<li> タグで表示されるマーカーの形を disc（既定値：黒丸）、circle（白丸）、square（四角）、decimal（1, 2, 3...）、lower-roman（i, ii, iii...）、upper-roman（I, II, III...）、lower-alpha（a, b, c...）、upper-alpha（A, B, C...）、decimal-leading-zero（01, 02, 03...）、lower-greek（α、β、γ...）、upper-greek（Α、Β、Γ...）、lower-latin（小文字ラテン文字）、upper-latin（大文字ラテン文字）、hebrew（ヘブライ数字）、armenian（アルメニア数字）、georgian（グルジア数字）、cjk-ideographic（一、二、三...）、hiragana（あ、い、う...）、katakana（ア、イ、ウ...）、hiragana-iroha（い、ろ、は...）、katakana-iroha（イ、ロ、ハ...）、none（なし）、inherit（継承）のいずれかで指定します。ブラウザによりサポート状況は異なります。

UL LI { list-style-type: disc; }
UL UL LI { list-style-type: circle; }
OL LI { list-style-type: decimal; }
OL OL LI { list-style-type: lower-alpha; }

マーカーの位置を outside（既定値：外側）、inside（内側）、inherit（継承）のいずれかで指定します。inside を指定すると、リストアイテムの文章が折り返された時に、マーカー分の字下げが行われなくなります。

LI { list-style-position: inside; }

<li> タグで表示されるマーカーのイメージを URL、none（無し）、inherit（継承）のいずれかで指定します。

UL { list-style-image: url(image/pochi.gif); }