2017-01-05 3 views
-4

Ich fange gerade an, Websites zu erstellen. Ich möchte Sie font-awesome für mein Symbol und als Text Schriftart. Leider obwohl ich alles importiert habe, funktionieren einige Teile nicht. Ich habe alle Icons funktioniert und sogar das animierte Zeug ist in Ordnung.AwesomeFont ändert nicht die Schriftart

Ich habe auch die Schriftart auf meinem PC installiert, aber ich bekomme meinen Browser nicht, um die tatsächliche Schriftart zu ändern. Als ich

font-family: 'FontAwesome'; 

geben tut es einfach nur verwendet Times New Roman.

Gibt es etwas, das ich vermisst habe? Hier ist meine eigentliche CSS- und .html mit den entsprechenden Teilen:

<head> 
    <meta charset="UTF-8"> 
    <title>foo</title> 
    <link rel="stylesheet" href="font-awesome-4.7.0\css\font-awesome.min.css"> 
    <link rel="stylesheet" href="design.css"> 
</head> 

und

body { 
    max-width: 600px; 
    margin: 50px auto 300px; 
    font-family: 'FontAwesome'; 
    font-size: 16px; 
    line-height: 1.2;  
} 
+3

Sie haben die falschen Schrägstriche für die href. –

+1

Sie sollten das Fontawesome im Körper nicht als 'font-family' verwenden. Hast du das "How to" auf der Website gelesen? – Dekel

+0

Haben Sie die notwendigen Font Awesome Font-Deklarationen in Ihre CSS-Datei aufgenommen? – junkfoodjunkie

Antwort

0

Um die Schrift-awesome zu verwenden, sollten Sie die entsprechenden css Datei enthalten und die Elemente verwenden, um mit die relevanten Klassen. Hier

ein Beispiel:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" /> 
 

 
<i class="fa fa-camera-retro"></i> fa-camera-retro

Der relevante Teil ist <i class="fa fa-camera-retro"></i> - der "Code" für das Kamera-Symbol ist eigentlich die Klasse fa-camera-retro innerhalb des <i> Element.

Für die vollständige Liste der Symbole (und die Namen der Klassen zu verwenden) können Sie die komplette icon list besuchen.

1

Eigentlich habe ich einen Fehler gemacht zu denken, dass font awesome etwas ist, dass ich einen anderen Textstil bekommen kann. Es ist nur für Icons, wie @Scott in einem der Kommentare sagte.

0

".... und als Text font"

FontAwesome hat nicht enthalten alphanumerische Textzeichen. Sie können es nicht für Text verwenden, es ist nur für Symbole/Symbole.

Darüber hinaus müssen Sie entweder eine Verknüpfung zu einem cnd-Repository für die eigentlichen Schriftartdateien (.otf, .eot, .svg, .woff, .woff2) herstellen oder sie herunterladen und auf Ihrem Server installieren.

Verwandte Themen