マテリアルアイコン使い方
- 以下のコードをhead内に記入
<link href=”https://fonts.googleapis.com/icon?family=Material+Icons” rel=”stylesheet”>
- google fontsのサイトから、欲しいアイコンを検索する
<span class="material-icons-outlined">
castle
</span>
上のようにhtml内にspanタグを書いて読み込む
もしくは、
擬似要素を使って、cssに記入することで表示する方法もあります。
https://websae.net/google-material-icons/
今回、なぜアイコンが表示されなかったか。
spanタグコピーして、貼り付ければ表示されるような感じになっているけど、
spanのクラス名の material-icons-outlined じゃ表示されない!
material-icons に直さないといけない。
前にも聞いたことある気がするけど忘れていた。
ブラウザによっては、outlinedつけても表示されるのか?
chromeとbraveしか入っていないので、確かめていない。
|