- 1. 概要
- 2. リンクの設置
- 3. 設置方法
1. 概要
「Font Awesome」の設置方法について、記述します。
2. リンクの設置
まずは、「HTML」のヘッダ部に、以下を記載します（バージョンがこれで古くないかは未確認。2019年01月23日）。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
と、上記は、最初に参考にしたサイトのものですが・・・。
「Start | Font Awesome」（配布サイト本家）によれば、2019年02月25日現在は
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
が、正しいらしい。
長くなっとるし、属性名「integrity」「crossorigin」は、エディタによっては警告が表示されますので、その場合はエディタの設定をいじる必要があります。
あんど。下の方で設置していたアイコンが消えてしまった。
表記方法が変わったようです。
2022年6月23日現在の最新リリースバージョンは「6.1.1」とのこと。
また、書き方が変わりました。
探すのが大変でしたが、本家の「Install Manually | Font Awesome Docs」で見つけました。
下記のように記述しました。
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.1.1/css/all.css" integrity="sha384-/frq1SRXYH/bSyou/HUp/hib7RVN1TawQYja658FEOodR/FQBKVqT9Ol+Oz3Olq5" crossorigin="anonymous"/>
だいぶ記述が変わっているようなのですが、古くからあるものも、キープされているようです。
2026年3月19日、バージョン「7.2」になっているようです。
本ページも書き直さなきゃね。
3. 設置方法
で例えば、歯車アイコンを表示するには。
<i class="fa fa-cog"></i>
と書けばいいのです。。
でまぁ、書いてみると → ← ここに出ているはず・・・。
このクラス名は検索するしかないみたいです。
|
|
