字體圖標任意縮放不會失真,也大大減少請求數量,非常好用。
在線生成工具:https://icomoon.io/app/#/select
在線SVG圖庫(阿里), 用於導入:http://www.iconfont.cn/search/index?q=%E9%92%B1&page=1
1、進入網址:主頁面
2、新建一個圖集
3、添加.svg圖片(可以使用現成的,也可以使用自定義的)
使用現成的點擊頁面紅色的Add Icons...
使用自定義的直接拖拽進圖集即可添加
4、生成字體文件
(1)切換工具欄 “選擇” 標簽(見下圖),選擇好要生成的圖標(自由選擇)
(2)點擊底部的:"Generate Font F"
可以自由命名 具體圖標的樣式名:
5、修改完成后,點擊生成Font
下載壓縮文件,解壓:
運用:將fonts文件夾全部內容和style.css文件放到相應的項目中。
根據css文件下面生成的class類的名稱添加到html對應的節點上即可添加字體。
當然添加字體還需要設置font-size,也可以根據實際情況設置color改變其顏色。