it-swarm.com.de

Wie kann ich die lokale Datei von Font awesome 4.1 ohne CDN einbinden?

With font awesome effect Dies ist der Effekt mit der Schrift fantastisch, ich kann ihn nur bekommen, wenn ich die Schriftart fantastisch 4.1 CDN verwende.

enter image description here Mit heruntergeladenen Dateien habe ich den Ordner "fonts" und "font-awesome.css" eingefügt, aber es wird immer noch kein Symbol angezeigt.

enter image description here.__ Mein Link ist korrekt.

enter image description here Der Dateipfad font-awesome.css, ich habe nichts geändert.

enter image description here Verzeichnisordner und Dateien.

enter image description here innerhalb des Font-Ordners.

enter image description here im CSS-Ordner.

**************************************************** **************************************************** *******************************
Ich habe das Problem bereits gelöst. Dies ist auf einen Fehler bei der Eingabe des Codes zurückzuführen. Ich tippe den fontawesome v3.1-Stil ein 

 <i class="icon-Twitter-sign icon-x3"></i>

und jetzt verwende ich v4.1, deshalb hat es nicht funktioniert. Es sollte sein 

 <i class="fa fa-Twitter icon-x3"></i>

damit es funktioniert.

20
user3066033
  1. Laden Sie das fontawesome-Paket von der Website herunter. 
  2. Extrahieren Sie das Paket, in dem Sie die Datei fontawesome.css finden. 
  3. Kopieren Sie diese Datei in Ihr CSS-Verzeichnis 
  4. kopieren Sie alle Zeichensatzdateien aus dem extrahierten fontawesome-Paket in Ihren Zeichensatzordner.
  5. Fügen Sie der HTML-Seite schließlich die Datei fontawesome.css hinzu, indem Sie den entsprechenden Speicherort der CSS-Datei angeben.

UND Voila! 

24
Sithira

Nur das Herunterladen von Css und das Verlinken auf die Datei macht keinen Sinn. Sie sollten sich die Css-Datei ansehen.

Sie haben den Ordner mit den Schriftarten nicht heruntergeladen, in dem alle Schriftartenstile gespeichert sind ....__ Laden Sie ihn also herunter und geben Sie den Pfad zu den Zeichensatzdateien auf Ihrem System an in font-awesome CSS-Dateien ..

Laden Sie Schriftarten von den CDN-Links herunter und speichern Sie sie im Ordner "Schriftarten".

bootstram font awesome

Hoffe, das wird für Sie funktionieren ..

11
Srinivas08

Möglicherweise stellen Sie fest, dass die Entwickleroptionen in Ihrem bevorzugten Browser eine Vorstellung davon vermitteln, warum die Datei nicht funktioniert.

Font awesome erfordert die dazugehörigen Font-Dateien. Die CSS-Datei referenziert diese und versucht sie einzuschließen, kann sie aber derzeit nicht finden.

Laden Sie font-awesome-4.1.0.Zip von FontAwesome

Dann extrahieren Sie das und legen Sie die Ordner "CSS" und "Schriftarten" in Ihr Projekt. Sie können die Datei dann wie folgt referenzieren:

<link href="css/font-awesome.min.css" rel="stylesheet">
5

Da ich FontAwesome V5.3.1 verwende, möchte ich diese Antwort aktualisieren, da die Ordnerstruktur in dieser Version etwas geändert wurde.

  1. Laden Sie zunächst die FontAwesome v5.3.1 herunter und entpacken Sie den Ordner.
  2. Kopieren Sie die all.min.css-Datei aus dem CSS-Ordner und fügen Sie sie Ihren Stylesheets hinzu.
  3. Kopieren Sie nun den webfonts-Ordner aus dem FontAwesome-Extrakt und legen Sie ihn oben in Ihr Projektverzeichnis in Ihre all.min.css-Datei. (Siehe das Bild unten)

 enter image description here

Da sich all.min.css-Datei jetzt auf den webfonts-Ordner bezieht, müssen wir diese Datei zusammen mit dem webfonts-Ordner hinzufügen.

src: url("../webfonts/fa-brands-400.eot"); // This is how it is been referred now in all.min.css file.

Vielen Dank.

3
Balasubramani M

Für den Fall, dass Sie .htaccess verwenden, müssen Sie relative Links zu eot & woff-Dateien außer css sicherstellen

1) entpackte Zip-Datei in das gewünschte Verzeichnis extrahieren

falls .htaccess path ist 

H:\virtualhost\.htaccess

und fontawesome css und fonts Pfad ist

H:\virtualhost\fontawesome-free-5.4.2-web\css

H:\virtualhost\fontawesome-free-5.4.2-web\webfonts

2) Nehmen Sie folgende Einträge in .htaccess vor

RewriteRule ^ css/([^ /] *). Css $ /fontawesome-free-5.4.2-web/css/$1.css [L]

RewriteRule ^ webfonts/([^ /] *). Eot $ /fontawesome-free-5.4.2-web/webfonts/$1.eot [L]

RewriteRule ^ webfonts/([^ /] *). Woff2 $ /fontawesome-free-5.4.2-web/webfonts/$1.woff2 [L]

RewriteRule ^ webfonts/([^ /] *). Woff $ /fontawesome-free-5.4.2-web/webfonts/$1.woff [L]

3) Fügen Sie Folgendes im Hauptteil von HTML hinzu

http: // lokale-ip-adresse: port/css/all.css

0
vivek shirodkar
  1. Fontawesome herunterladen (font-awesome-4.7.0): http://fontawesome.io/get-started/
  2. Entpacken und kopieren Sie Ihr Projekt so, wie es ist.
  3. In der HTML-Referenz font-awesome.min.css, z. B .: <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css">
0
CKuharski