Genera stili CSS per liste con anteprima live. Scegli tra punti standard, numeri, emoji, immagini personalizzate e altro. Copia il codice CSS istantaneamente. Puro lato client.
CSS list-style controlla come vengono marcati gli elementi della lista. Questo generatore ti permette di visualizzare in anteprima tutti i tipi di lista CSS standard e creare marcatori personalizzati con emoji, icone o immagini. Il CSS generato usa il pseudo-elemento ::marker per browser moderni con supporto fallback.
Il pseudo-elemento ::marker targetizza il riquadro del marcatore della lista. Permette di stilizzare punti e numeri con colori, font e dimensioni personalizzati. I browser moderni supportano ::marker, ma il generatore fornisce anche CSS fallback per browser più vecchi.
Sì, puoi usare la proprietà list-style-image o il pseudo-elemento ::marker con content. Il generatore supporta entrambi gli approcci. Per i migliori risultati, usa piccole immagini SVG o PNG (16x16px a 24x24px).
Il pseudo-elemento ::marker è supportato in tutti i browser moderni inclusi Chrome 86+, Firefox 68+, Safari 11.1+ e Edge 86+. Per browser più vecchi, il generatore fornisce CSS fallback usando proprietà list-style standard.
Usa il pseudo-elemento ::marker con la proprietà color. Il CSS generato include questo automaticamente. Per le liste ordinate, questo cambia il colore dei numeri mantenendo il testo dell'elemento nel suo colore originale.