阿里矢量图标iconfont在微信小程序的使用

							阿里矢量图标iconfont在微信小程序的使用

第一步：进入官网： https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.2

第二步找到自己需要的图标，添加至购物车，如下图

第三步.进入购物车中查看

这是已添加成功的：
点击确定进入到该项目中

第四步：下载至本地

第五步：解压 会得到类似于该文件名的文件夹 font_2003460_ffwtix36mni
点进去的目录结构：

第六步：我们一共需要五个物件，就是上面我选中的五个，其它的都是没用的，接着，新建一个文件夹，名字如：iconfont，将这五个文件放进去，接着将后缀为.css的文件改为后缀为wxss适用于微信小程序的文件格式

第七部：将该iconfont文件夹拷贝至你当前的微信小程序项目的根目录，与app.js同级

第八部：在app.wxss文件中全局引入

第九步：打开iconfont.wxss文件，结构如下

第十步：使用，通过class 的方式 （iconfont是必加）


微信小城上使用iconfont的方式已完成，

如果我们需要更换图标的颜色，不需要去官网重新下载了，只需要将该标签的color更改即可
如

至于在原有的图标上再添加新的图标，不需要替换文件，操作过程还是和上方的一样，只是将iconfont.css文件的内容拷贝至当前iconfont.wxss文件中即可

还是不理解的可以联系我