![見出し画像](https://assets.st-note.com/production/uploads/images/77096005/rectangle_large_type_2_77c395c63ef064c58dba3e275d97df30.jpeg?width=1200)
Font Awesome
css ファイルを読み込む URLを取得する
link rel ="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
↑この css ファイルの URI は「font-awesome - Libraries」から
取得できます。
使用するアイコンの HTML を取得する
Font Awesomeのサイトへ、赤枠部分をクリック↓
![](https://assets.st-note.com/img/1650779071749-u3L7GdYCDF.png?width=1200)
表示されたアイコンから、必要なものをクリック。
![](https://assets.st-note.com/img/1650779255578-fXMYyOZzXV.png?width=1200)
赤枠部分をクリックし、コピー
![](https://assets.st-note.com/img/1650779398455-aoyIoANmi0.png?width=1200)
htmlの任意の場所にペースト
*デフォルトのサイズは少し小さめ...なので
任意のサイズにカスタマイズするには
↓
<i class="fab fa-apple fa-2x"></i>
標準 <i class="fab fa-apple"></i>
x1.3 <i class="fab fa-apple fa-lg"></i>
x2 <i class="fab fa-apple fa-2x"></i>
x3 <i class="fab fa-apple fa-3x"></i>
fa-◯x数値を大きく
この記事が気に入ったらサポートをしてみませんか?