※ これは 2020/04/10 時点の font awasome v5.13.0 の情報です
最新版では動作が異なる可能性がありますのでご注意ください
アイコン的なものを CSS に埋め込む場合、普通にやったら画像として参照しないとだめそうです
・・・が、テキストみたいな使い心地でアイコンを埋め込めるサービスがあるらしい!
さっそく試してみる
スポンサードリンク
まずは下記のページでメールアドレスを入力して、無料登録
届いた仮登録メールのリンクをブラウザで開き、パスワード、かんたんなアンケートを英語で入力すればすぐに登録完了しました
まずは <head>
タグ内でスタイルシートを参照しておく必要があるらしい
<head> <link href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" rel="stylesheet"> </head>
バージョンのところは最新版にしておかないと、最新のアイコンは使えないっぽい
現時点の最新は v5.13.0 だったのでそちらを指定しました
さっそく下記のようなコードを書いてみた
<p><i class="fas fa-cat"> ねこきたー!</i></p>
ねこきたー!
出たー!でも小さい!
大きさを2倍にするにはこんな感じに書きかえればいいらしい
<p><i class="fas fa-cat fa-2x"> ねこきたー!</i></p>
ねこきたー!
できた・・・これはかんたんだ!