小程序引入第三方图标(阿里图标)

文章详细介绍了如何在小程序中使用阿里图标库的步骤,包括从仓库添加图标,下载并解压,新建static文件夹存放iconfont.wxss,并修改font-face,然后在app.wxss全局引用,最后在页面中使用时需提供正确的类名。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.先将需要的图标添加到仓库

2.点击下载到本地

3.将压缩包解压出来

4.新建static文件夹,将iconfont.css放在这里,并且改为iconfont.wxss

5.在iconfont.wxss中修改@font-face,从阿里图标库中复制过来

6.在app.wxss进行全局引用

@import 'static/iconfont.wxss';

7.页面中使用

<icon class="iconfont icon-shouye1"></icon>

说明:一定要加类名,第一个类名就是@font-face中的iconfont-family属性的值,一般默认是iconfont,不需要修改但一定要加;第二个类名是需要引入使用的图标的图标名称。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值