Cookies (~ Keks oder Plätzchen / Datenpaket) erleichtern die Bereitstellung der Inhalte dieser Website und ganz ehrlich! - Sie helfen auch dabei die Seite funktionaler und schöner zu machen. Mit der weiteren Nutzung dieser Website erklärst Du Dich damit einverstanden, dass die Seite einige wenige Cookies verwendet. Datenschutzerklärung Fenster schließen

websitewerker.de kassel

19. September 2019 - von Jens in Webentwicklung
Material IO CSS – Listen Elemente um Symbolik mit ::before Selector ergänzen

Der ein oder andere hat vielleicht schon nach der Möglichkeit gesucht HTML Listen-Elemente um eine Symbolik aus dem Pool der Icons von marterial.io zu ergänzen. Es gibt zwei Möglichkeiten das zu tun. Entweder über den Unicode oder über den Namen des Icons. Letzteres ist etwas eleganter und mit Sicherheit auch schneller. Im nachoflgendem Beispiel will ich als Symbolik den „double_arrow“ einsetzen. Dazu lege ich eine Klasse für meine Liste an und verändere sie an nur zwei kleinen Stellen.

Die Liste:

Das entsprechende CSS dazu:

Mehr dazu:


Diese Seite unterstützen?

Wenn dir dieser Beitrag geholfen hat, würde ich mich über ein kleines Dankeschön freuen.


Schreibe einen Kommentar

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

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.

Vielen Dank an Wordpress für diese hammermäßige Software!