前言
在微信小程序中使用iconfont，總體來說可以分為兩步
- 1：生成iconfont代碼
- 2：在小程序中引入iconfont
具體操作見下文
1. 生成iconfont代碼
-
進入[iconfont官網(wǎng)](https://www.iconfont.cn/中搜索對應(yīng)的圖標(biāo)，如：
-
找到需要的圖標(biāo)樣式，并添加入庫：
-
添加后，點擊右上角的購物車，即可看到已添加的圖標(biāo)
image.png -
點擊添加至項目，點擊后選擇目標(biāo)項目名
-
沒有需要的項目名可以點擊右邊文件夾圖標(biāo)新建項目
-
確認(rèn)之后，界面會自動跳轉(zhuǎn)，跳轉(zhuǎn)的界面如下：
-
鼠標(biāo)移入到icon上可以選擇相應(yīng)的操作，如圖：
-
選擇編輯圖標(biāo)可以對圖標(biāo)進行相應(yīng)的編輯如：顏色更換，設(shè)置大小，方向等，修改后保存即可
-
保存后iconfont則制作完成啦，點擊“下載至本地”按鈕，將相關(guān)資源下載至本地解壓之后即可使用啦
注：可以制作多個iconfont之后一起下載
2. 小程序引用iconfont
-
將上一步下載的文件解壓后，打開iconfont.css，復(fù)制文件內(nèi)的內(nèi)容至小程序的wxss文件內(nèi)，如：
-
在相應(yīng)的wxml中引入即可，引入格式為class='iconfont icon-自定義名稱'，具體如下：
-
引入成功后，編譯后可查看結(jié)果：
-
iconfont中制作的顏色在小程序中顯示無效，可在對應(yīng)的wxss文件中手動設(shè)定顏色：
-
編譯后可查看結(jié)果：
