Font-awesome zeigt sich als Quadrate

Ich versuche Font-Awesome (v4.7) zu arbeiten, aber es erscheint nur als Quadrate. Ich habe den Schriftarten-Ordner im Stammverzeichnis meiner Website und die CSS in einem Ordner namens style. Ich habe die Schriftarten in das Schriftarten-Verzeichnis aufgenommen und die Schriftart-awesome.css-Datei bestätigt. @ Font-face hat eine URL von "../fonts/". Ich gehe davon aus, dass die Referenz vom CSS verwendet wird, damit es korrekt ist, wenn sich das CSS in einem Unterordner des Stammverzeichnisses befindet und sich die Schriftart im Ordner "root/fonts" befindet.Font-awesome zeigt sich als Quadrate

Die Bootstrap-Glyphicons funktionieren und die Bootstrap-Fonts befinden sich im selben Verzeichnis wie die font-awesome-Fonts.

<span class="fa fa-refresh">FA</span> 
<span class="glyphicon glyphicon-cloud">glyph</span>

Wenn ich an den Entwickler-Tools aussehen Ich sehe keine Fehler, und ich kann die Schriftart-awesome Tag wie es zu sehen sein sollte.

Hat jemand irgendwelche Vorschläge?

Masterpage. Ich weiß nicht, warum alle Verfallszeiten da sind, ich habe diese Seite geerbt, aber ich denke nicht, dass das ein Teil des Problems ist.

<head runat="server"> 
    <title>Preferential Bidding System</title> 
    <meta http-equiv="cache-control" content="max-age=0" /> 
    <meta http-equiv="cache-control" content="no-cache" /> 
    <meta http-equiv="expires" content="0" /> 
    <meta http-equiv="expires" content="Mon, 01 Jan 1900 1:00:00 GMT" /> 
    <meta http-equiv="pragma" content="no-cache" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <link href="style/bootstrap.css" rel="stylesheet" /> 
    <link href="style/font-awesome.css" rel="stylesheet" type='text/css' /> 
    <link href="style/layout.css" rel="stylesheet" type='text/css' />  

    <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script> 
    <script src="js/jquery-ui-1.10.1.custom.min.js" type="text/javascript"></script> 

    <asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head>

Quelle

2016-11-23 Caverman

Versuchen Sie stattdessen einen absoluten Pfad – j08691

Wenn Sie nach 'fa suchen "refresh" oder "glyphicon-cloud" im geladenen css, ist es da ?, manchmal ist die Schriftart vorhanden, aber die Symbole, die wir verwenden möchten, sind nicht Teil der Schriftart! – mojarras

Ich bin mir nicht sicher, wie nach was in geladenem css gesucht wird. Ich öffnete die Dev-Tools und suchte nach Glyphicon-Cloud und es fand nur die eine Referenz, die ich auf der Seite hatte. – Caverman

Zunächst einmal versuchen, die Syntax wie bei Font Awesome Seite beschrieben (was bedeutet, <i> zu <span> gegen):

<i class="fa fa-address-book" aria-hidden="true"></i>

Wenn das nicht weiter Lesen helfen:

I Hab mir das mehrmals in den letzten 2-3 Jahren passiert und es ist immer einer der folgenden:

a) falsch relativ/abso Laute Pfad => in letzter Zeit bin ich nur die Font Awesome CDN verwenden, die dies kein Thema

b) Tippfehler in meinem Code macht - manchmal ist es einfach, die offensichtlich

Mit Blick auf Ihrem Code zu verpassen Ich bin Neigung zu a) und ich würde Ihnen raten, das CDN zu versuchen, auch wenn es einen Grund gibt, es in diesem Fall nicht zu benutzen - aber es wird Ihnen helfen, leicht zu testen, ob es einen Problem mit Ihrem Pfad gibt.

Nebenbei bemerkt: verwenden Sie zufällig Less, um einige zusätzliche CSS vorher zu kompilieren? Vielleicht gibt es ein Verwechseln mit einer älteren Version von Font Awesome, die irgendwo gespeichert und referenziert wird (und es könnten Icons fehlen, die zB nur v4.7 sind)

Quelle

2016-11-23 21:47:11 tech4242

Danke für die Tipps. Ich werde versuchen, sie auszuprobieren. Wir sollten CDN verwenden, da die Site für interne gesperrte Computer gedacht ist, aber zum Testen ist es eine gute Idee. Ich kompiliere WENIGER auf dieser Seite nicht.Normalerweise tue ich das, aber das ist eine geerbte Seite, die ich versuche, mich minimal zu ändern, und ich wollte im Moment nicht mehr Komplexität einführen, aber ich muss das vielleicht ändern. – Caverman

Das CDN hat funktioniert. Frage mit dem Pfad zu den Schriftarten. In der font-awesome.css Datei ist die URL "../fonts/", ist das nicht relativ zur CSS Datei und nicht zur .aspx Seite? Wenn es relativ zur CSS-Datei ist, dann ist das korrekt, da sich das CSS im Ordner "root/style" befindet. Wenn es relativ zu dem ASPX ist, sollte es wahrscheinlich nur "/ Fonts /" sein. Ich glaube, ich habe "~/fonts /" versucht und das hat nicht funktioniert. – Caverman

Ich denke, es ist relativ zu .aspx. Haben Sie mit einem absoluten Aspx-Pfad versucht, um sicher zu sein? – tech4242

Font-awesome zeigt sich als Quadrate

Antwort

Verwandte Themen