font awesomeがローカル環境で表示されない対処方法

サーバーからページに名前を付けて保存した場合に、font-awesome.cssは読み込まれているのにフォントアイコンが表示されないで□みたいになり表示されないとき。

 

 

CDNなど最新を読み込んでも表示されない場合があります。
その場合はfont awesomeのクラス名があるバージョンのcssファイルをCDNで読み込んでみます。

 

 

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

 

 

今回はこのケースである程度、ローカル環境でもWebフォントでアイコンを表示させることができました。一部、表示されないものがある場合は、別のバージョンで試してみると表示されるかもしれません。

 

 

基本的にはclass=”fa fa-xxxxxなどからはじまるセレクタ名をヒントに探していくとよいでしょう。