1.选择图标加入购物车

2.添加完成后点击购物车

在小程序中使用阿里图标

3.点击添加至项目

没有项目新建即可

4.选择下载到本地

在小程序中使用阿里图标
下载完成后解压,复制出其中的iconfont.css文件,修改文件后缀为.wxss

5.新建存放iconfont.wxss的文件夹

在微信小程序项目中新建icon文件夹,将上面修改过的iconfont.wxss文件导入

6.修改iconfont.wxss文件内容

在小程序中使用阿里图标
在项目页面内根据提示生成代码,点击“点此复制代码”。
在小程序项目中打开iconfont.wxss文件,把@font-face部分替换为复制的@font-face部分。

7.引用

在app.wxss文件中正确引用iconfont.css文件。

在小程序中使用阿里图标
引用正确即可使用:
在小程序中使用阿里图标
前面的iconfont是固定用法,不能改。想获取图标的名字可以点击项目页面的Fontclass选项,把鼠标移到图标上,点击“复制代码”即可获得图标名称。
在小程序中使用阿里图标
以下为成功的示意图:
在小程序中使用阿里图标

相关文章:

  • 2021-07-07
  • 2021-08-29
  • 2021-08-13
  • 2021-04-11
  • 2021-09-18
  • 2021-10-15
  • 2022-01-14
  • 2021-05-01
猜你喜欢
  • 2021-10-05
  • 2021-09-16
  • 2021-12-31
  • 2021-10-30
  • 2021-10-25
  • 2022-02-06
  • 2022-12-23
相关资源
相似解决方案