CSS für Listenelemente

Im Text Content von HTML Seiten werden Listen meist in ihrer Grundeinstellung verwendet. Entweder nummeriert mit Aufzählungszeichen oder einfach mit Punkten.

Mit „list-style-type“ kann man die Listenzeichen von Punkte beispielsweise in „square“ (Rechtecke) ändern oder durch „list-style-image“ Grafiken einsetzen. In meinen Beispielen blende ich mit „list-style-type: none;“ die Zeichen erstmal aus, um sie mit Pseudoelemente wie „:after, :before“ zu ersetzen.
Was sich mit CSS anstellen lässt, sieht man in meinem:

DEMO

Ich werde demnächst noch eine SASS Version erstellen…

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

*