開(kāi)發(fā)微信小程序,想引入漂亮的圖標(biāo),在阿里巴巴上直接引入之后總是報(bào)錯(cuò), 總算從網(wǎng)上找到解決方法,親測(cè)有效,
一、先到阿里巴巴矢量圖標(biāo)庫(kù)(http://iconfont.cn/),用微博帳號(hào)登錄,搜索你想要的圖標(biāo),然后添加入庫(kù)
下載下來(lái),找到ttf格式文件
二、到這個(gè)平臺(tái)https://transfonter.org/,把剛才下載的ttf字體文件轉(zhuǎn)化成base64格式
點(diǎn)擊Download下載下來(lái):
打開(kāi)stylesheet.css文件,復(fù)制這些內(nèi)容:
三、把剛才復(fù)制的粘貼到wxss文件中
四、打開(kāi)之前在阿里巴巴下載的壓縮包,找到iconfont.css文件,打開(kāi)它
也復(fù)制這些內(nèi)容到wxss文件中:
四、在wxml加入字體
五、顯示效果
提示:截圖中的代碼和演示效果可能不同 |