Generieren Sie CSS-Listenstile mit Live-Vorschau. Wählen Sie aus Standard-Aufzählungszeichen, Zahlen, Emojis, benutzerdefinierten Bildern und mehr. Kopieren Sie den CSS-Code sofort. Rein client-seitig.
CSS list-style steuert, wie Listeneinträge markiert werden. Dieser Generator ermöglicht Ihnen, alle Standard-CSS-Listentypen zu erkunden und benutzerdefinierte Marker mit Emojis, Symbolen oder Bildern zu erstellen. Der generierte CSS verwendet das ::marker-Pseudo-Element für moderne Browser mit Fallback-Unterstützung.
Das ::marker-Pseudo-Element zielt auf den Listenmarker-Bereich eines Listeneintrags ab. Es ermöglicht Ihnen, Aufzählungszeichen und Zahlen mit benutzerdefinierten Farben, Schriftarten und Größen zu gestalten. Moderne Browser unterstützen ::marker, aber der Generator bietet auch Fallback-CSS für ältere Browser.
Ja, Sie können die Eigenschaft list-style-image oder das ::marker-Pseudo-Element mit content verwenden. Der Generator unterstützt beide Ansätze. Für beste Ergebnisse verwenden Sie kleine SVG- oder PNG-Bilder (16x16px bis 24x24px).
Das ::marker-Pseudo-Element wird in allen modernen Browsern unterstützt, einschließlich Chrome 86+, Firefox 68+, Safari 11.1+ und Edge 86+. Für ältere Browser bietet der Generator Fallback-CSS mit Standard-list-style-Eigenschaften.
Verwenden Sie das ::marker-Pseudo-Element mit der color-Eigenschaft. Der generierte CSS enthält dies automatisch. Für sortierte Listen ändert dies die Farbe der Zahlen, während der Listeneintrag-Text in seiner ursprünglichen Farbe bleibt.