コピペで1分。アイコンフォントをCSSであっという間に使えるようにする方法

アイコン画像を使用せず、フォントデータとして使用するFont Awesomeアイコン、いわゆる「faアイコン」の設定と使用方法です。

といっても、Font Awesomeアイコン用のjavascriptコードをヘッダーで読み込ませて、後は使用したいアイコンのcssコードをページ内に記述するだけなので、1分もかからずに実現できます。

1.ヘッダーに以下のコードを貼り付けます。

<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">

2.Font Awesomeサイト(https://fontawesome.com/)で、使用したいアイコンを検索して、

フォントアイコンの使い方

3. アイコン用コードをコピー して使用したいページ内に貼り付ければ完了。

<i class="fas fa-home"></i>
Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on pinterest
Pinterest

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

seven − 7 =