■ヘッダに1行を追加
<link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined" rel="stylesheet">
■アイコンを選ぶ
https://fonts.google.com/icons
画面の右の方に表示されているコードをコピペ。
例） 虫眼鏡を選ぶのなら、設置したい場所に以下のコード
<span class="material-icons-outlined">
search
</span>
これで終わり。
CSS として書きたい時は、以下のようにコードポイントを記述する。
よく使うのは、PDF ファイルへのリンクの時。
a .pdf:before {
font-family: ‘Material Icons’;
content: "\e415";
font-size: 20px;
vertical-align:middle;
color: #333;
margin-right: 4px;
}
上記の記述で、PDF ファイルへのリンクがある時、勝手に PDF アイコンが付きます。
こんなかんじ。
コメント