如何在微信小程序中使用iconfont

一.在iconfont中找到自己需要的图标并加入创建的项目中
iconfont网址链接：https://www.iconfont.cn

我项目中添加的图标

二、点击下载至本地

下载的文件

三、对下载好的文件进行解压，更改名称，并将文件复制到项目文件中

1.文件夹命名为fonts，名称可取任意
2.删除的demo.css和demo.html为官网使用文档，可以根据需要进行删除
3.将iconfont.css改为iconfont.wxss，小程序中css样式文件后缀为wxss
4.将fonts文件夹放在assets下（放置位置依据个人习惯）

更改文件过程
fonts位置

四、在页面中进行引入使用iconfont

1.在使用界面wxss引入样式表fonts/iconfont.wxss

index.wxss界面

@import '/assets/fonts/iconfont.wxss';

2.在index.wxml页面中使用

  <icon class="iconfont iconshangyishou"  ></icon>

iconfont必须要写 ；
iconshangyishou是样式名称
样式名称可在iconfont我的项目中复制代码获取

获取样式名称

五、修改样式名称

打开fonts/iconfont.wxss，找到需要修改样式的图标名称替换为新的名称icontext
此处以iconshangyishou为例,将样式名称修改为icontext

更换名称操作