CSS の ::marker
疑似要素は、リスト項目の箇条書き記号ボックス(ふつうは黒丸や番号)を選択します。これは display: list-item
が設定された要素や疑似要素、例えば <li>
要素や <summary>
要素で利用できます。
::marker { color: blue; font-size: 1.2em; }
利用できるプロパティ
::marker
擬似要素では、一部の CSS プロパティのみが利用できます。
構文
::marker
例
HTML
<ul> <li>Peaches</li> <li>Apples</li> <li>Plums</li> </ul>
CSS
ul li::marker { color: red; font-size: 1.5em; }
結果
仕様書
仕様書 | 策定状況 | コメント |
---|---|---|
CSS Pseudo-Elements Level 4 ::marker の定義 |
草案 | 重要な変更はなし。 |
CSS Lists Module Level 3 ::marker の定義 |
草案 | 初回定義。 |
ブラウザー実装状況
このページの互換性一覧表は構造化データから生成されます。データに協力したいのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。