iconfont使用方法详细完整版

一.注册阿里巴巴iconfont账号

官网注册
注册我就不演示了

二.创建使用项目

根据图片顺序操作即可

在这里插入图片描述
在这里插入图片描述

根据需求自行创建 基本直接新建可满足项目需求

在这里插入图片描述

创建好后页面不一定会刷新,执行第一张图片操作才能看到你创建的项目

添加图标
请添加图片描述
在这里插入图片描述

在这里插入图片描述

把这个拉取到自己项目css地址

在这里插入图片描述

复制iconfont更新的代码

请添加图片描述

替换代码

在这里插入图片描述

需要在复制的代码前面加hhtp:
如果加了新图标需要更新代码

使用方法

复制代码
在这里插入图片描述

然后使用 需要加class=“icon iconfont”

<i class="icon iconfont">
 &#xe609;
</i>

在这里插入图片描述

最后需要在官网配置iconfont地址,防止报错(可不配置,不对所有人有效,只是警告无影响
小程序官网

开发管理==》开发设置===》配置download合法域名
https://at.alicdn.com

总结:
这个兼容老版本浏览不太好,需要兼容用fontClass我没有兼容需求
其次是这样的代码 " &#xe60 9;" 肯定没有icon-tools可读性好,但对我个人没区别

学会这一种其他的也差不多会了。

如果有用,请给我点赞收藏,我会很开心,谢谢

  • 9
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值