【今日のQ&A】完成度が高まるアイコンの作り方【Webデザイン】

こんにちは、@codeship_techです。

今回は、WEBページをデザインする上でよく必要になるアイコンを簡単に作って表示することができるサービスの紹介です!

htmlでIconを表示させたいんですけど、調べたらFontAwesomeというものがあることを知りました。FontAwesomeはどうやって使いますか?

FontAwesomeはまずは公式ページにいき、ログインをしてください。https://fontawesome.com/

ログインをした後に https://fontawesome.com/kits にいき、
下記のようなScriptを探してコピーしましょう。

<script src="https://kit.fontawesome.com/xxxxx.js"></script>

コピーしたら、Iconを表示させたいhtmlのheadタグ内で先ほどコピーしたscriptタグを貼り付けてください。
その後にbodyタグに下記を貼り付けるとサーチIconが表示されます。

<i class="fas fa-search"></i>

なお他のアイコンを使用したい場合は https://fontawesome.com/icons?d=gallery から探して使ってみてください。

授業日記についてのご意見

CodeShipの授業について「こんな事が知りたい・紹介して」というご意見・ご提案がありましたら、CodeShip公式Twitterアカウント(【CodeShip】プログラミングスクール)までDMまたはリプライにてお寄せください。