首先将选择好的图标加入购物车,点击右上角购物车图标,将其添加进项目中。(Add To Project)
添加进入项目后,会自动跳转到该项目,选择Download Code,
解压缩包,只会用到文件夹中的4个文件,将解压后的下面4个文件放到小程序项目中
记得要将iconfont.css后缀改为wxss
在miniprogram中新建一个文件夹iconfont,将上述4个文件拖拽到文件夹iconfont中
然后,在app.wxss中引入
@import "./iconfont/iconfont.wxss";
根据先前下载好的字体文件夹,找到demo_index.html文件,进入该网页,查看所有icon的名字
然后,在wxml中以如下格式引用,标签不唯一
<text class='iconfont icon-nan'></text>
此时会开发者工具会报错
解决方法就是在iconfont.wxss中,将如下代码路径改变一下
更改前
更改后,注意要与先前新建的文件夹名称一致
最后,icon就显示出来了