CSS Hilfe benötigt zu Selectorenhierarchie

[Gunnar Bittersmann]

@@Sven

Erwähnte ich schon, dass du SVGs verwenden solltest?

Kannst Du mir erklären, warum?

• Michael Irigoyen kann: Stop Using Icon Fonts
• Tyler Sticka kann: Seriously, Don’t Use Icon Fonts
• Chris Coyier kann: Inline SVG vs Icon Fonts

und auch,m wie ich die verwende?

Du gehst zu Downloads und lädst dir das Paket runter. Aus den SVG-Dateien kannst du dir die Pfade und viewBox-Größen für die benötigten Icons rausholen.

Da du die Icons mit CSS färben möchtest, müssen die SVGs inline im HTML sein und auf fill="currentColor" gesetzt sein, dann übernehmen sie die Textfarbe: inline SVGs.

Wenn ein Icon mehrfach auftritt, ist es natürlich blöd, jedesmal den SVG-Code dafür zu duplizieren. Du kannst auch alle Icons als symbols in ein svg-Element tun und von dort referenzieren: SVG symbols.

Das kannst du auch in eine externe SVG-Ressource auslagern, wie auf dieser Testseite gezeigt. (Wegen CORS-Gedöns nicht als Codepen.)

---

fa 4.7, ich glaube, das gibt es keine SVGs

Ich glaube, Fontawesome bietet die SVGs zu den Icons schon seit längerem an. Die heben das bloß nicht so hervor; man muss wissen, wonach man suchen muss.

🖖 Живіть довго і процвітайте