web-dev-qa-db-fra.com

Comment inclure un fichier local de font awesome 4.1 sans utiliser CDN?

With font awesome effect C'est l'effet avec la police géniale, je ne peux l'obtenir que lorsque j'utilise la police géniale 4.1 CDN)

enter image description here À l’aide des fichiers téléchargés, j’ai inclus le dossier des polices et le fichier font-awesome.css, mais aucune icône ne s’affiche.

enter image description here Mon lien qui est correct.

enter image description here Le chemin du fichier font-awesome.css, je n’ai rien changé.

enter image description here dossiers et fichiers de répertoire.

enter image description here à l'intérieur du dossier de polices.

enter image description here dans le dossier css.

************************************************* ************************************************* ******************************
J'ai déjà résolu le problème. Cela est dû à une erreur dans la saisie du code. Je tape dans le style fontawesome v3.1 

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

et maintenant j'utilise v4.1, c'est pourquoi cela n'a pas fonctionné. CA devrait etre 

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

pour le faire fonctionner.

htmlcsstwitter-bootstrapfonts
20
user3066033
  1. Téléchargez le package fontawesome sur leur site web. 
  2. Extrayez le package où vous trouverez le fichier fontawesome.css. 
  3. Copiez ce fichier dans votre répertoire css 
  4. copiez tous les fichiers de polices du paquet fontawesome extrait dans votre dossier de polices.
  5. Enfin, ajoutez le fichier fontawesome.css à votre page HTML en indiquant l’emplacement respectif du fichier CSS.

ET voila! 

24
Sithira

Juste télécharger css et lier au fichier n'aura pas de sens, vous devriez regarder dans le fichier css ....

Vous n'avez pas téléchargé le dossier de polices dans lequel tous les styles de polices sont stockés .... Téléchargez-le et donnez un chemin aux fichiers de polices situés sur votre système, dans les fichiers css font-awesome ..

Téléchargez les polices à partir des liens cdn et stockez-les dans le dossier des polices.

bootstram font awesome

J'espère que cela fonctionnera pour vous ..

11
Srinivas08

Vous constaterez peut-être que les options de développement de votre navigateur favori vous donneront une idée des raisons pour lesquelles le fichier ne fonctionne pas.

Font awesome nécessite les fichiers de polices qui l'accompagnent. Le fichier CSS les référencera et tentera de les inclure, mais ne pourra pas les trouver pour le moment.

Téléchargez font-awesome-4.1.0.Zip depuis FontAwesome

Extrayez ensuite ceci et mettez les dossiers css et fonts dans votre projet. Vous pouvez ensuite référencer le fichier comme suit:

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

Depuis que j'utilise FontAwesome V5.3.1, j'aimerais mettre à jour cette réponse car la structure des dossiers a été légèrement modifiée dans cette version.

  1. Tout d’abord, téléchargez le fichier FontAwesome v5.3.1 et extrayez le dossier.
  2. Copiez le fichier all.min.css à partir du dossier CSS et ajoutez-le à vos feuilles de style.
  3. A présent, copiez le dossier webfonts de l'extrait FontAwesome et placez-le dans le répertoire de votre projet ci-dessus dans votre fichier all.min.css. (Voir l'image ci-dessous)

enter image description here

Puisque le fichier all.min.css fait maintenant référence au dossier webfonts, nous devons ajouter ce fichier avec le dossier webfonts.

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

Je vous remercie.

3
Balasubramani M

Il est important d’assurer les liens relatifs vers les fichiers eot & woff autres que css, au cas où vous utiliseriez .htaccess.

1) extraire le fichier Zip téléchargé dans le répertoire souhaité

dans le cas où le chemin .htaccess est 

H:\virtualhost\.htaccess

et le chemin fontawesome css et fonts est

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

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

2) Faites les entrées suivantes dans .htaccess

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) Ajouter la partie suivante en tête de HTML

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

0
vivek shirodkar
  1. Télécharger fontawesome (font-awesome-4.7.0): http://fontawesome.io/get-started/
  2. Décompressez et copiez tel quel dans votre projet.
  3. En référence HTML, font-awesome.min.css exemple: <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css">
0
CKuharski