webentwicklung-frage-antwort-db.com.de

Font-awesome zeigt Platz statt Symbol

Ich muss die Schriftfamilie in einige DropDownList ändern, die ich habe. Die Symbole sind sichtbar, bis ich die Schriftfamilie ändere. Jede Schriftfamilie, die ich auswähle, funktioniert nicht für das Symbol. Daher sehe ich immer ein Quadrat. Wie kann ich das korrigieren?

Vielen Dank

6
aingeal_brea
  1. Fügen Sie in Ihrem <head>-Tag die Schriftart awesome ein, wie hier <link rel="stylesheet" href="https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css" integrity="sha384-dNpIIXE8U05kAbPhy3G1cz+yZmTzA6CY8Vg/u2L9xRnHjJiAK76m2BIEaSEV+/aU" crossorigin="anonymous">
  2. Verwenden Sie das Symbol genau wie folgt: <i class="fa fa-address-book" aria-hidden="true"></i>, nicht mehr, nicht weniger, nichts dazwischen, ändern Sie <i> nicht in <span> oder ändern Sie nicht font-family. Wenn Sie Farben und Stylings aktualisieren möchten, empfehle ich, neue Klassen hinzuzufügen und auf diese Weise zu aktualisieren.
2
Melcma

Setzen Sie bei <i>-Tags Priorität auf FontAwesome font-family.

body * {
font-family:'tahoma'!important;
}

body i {
font-family:'FontAwesome'!important;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<span class="fa fa-male"></span> <span>Male</span> 
<br>
<span class="fa fa-female"></span> <span>Female</span>
<hr>
<i class="fa fa-male"></i> <span>Male</span> 
<br>
<i class="fa fa-female"></i> <span>Female</span>

1
Farhad Bagherlo

Es kann auch sein, welchen Link Sie verwenden. Einige Symbole stammen aus neueren Versionen und funktionieren nicht mit alten Links des Repositorys.

Vergewissern Sie sich, dass die CD, die Sie verwenden, die neueste ist.

1
Fix3r