字体图标使用教程阿里字体图标iconfont 鲸鱼编程

鲸鱼编程pyhui

于 2021-09-19 16:32:16 发布

阅读量317

点赞数

文章标签： css html html5

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/ifubing/article/details/120381425

版权

官方网址

iconfont-阿里巴巴矢量图标库
https://www.iconfont.cn/

注册并登陆

在这里插入图片描述

寻找自己喜欢的图标

在这里插入图片描述

添加

在这里插入图片描述
首次使用新建一个项目

在这里插入图片描述

在这里插入图片描述

生成代码

需要点一下

在这里插入图片描述

生成后的结果

在这里插入图片描述

使用字体图标

复制生成的代码在样式中

在这里插入图片描述

复制字体的编码

在这里插入图片描述

在这里插入图片描述

新建一个行内标和签容器来存放这个代码

在这里插入图片描述

效果

在这里插入图片描述

给这个标签添加样式，主要指定一下字体

在这里插入图片描述

效果

在这里插入图片描述

调改字体图标

让图变大

在这里插入图片描述

让字体变颜色

在这里插入图片描述

追加图标

找到喜欢的图标追加到我们项目中即可

在这里插入图片描述

注意需要重新更新一下代码

然后更新到无们引入的地方

看到了新的图标就可以使用了

在这里插入图片描述

鲸鱼编程pyhui

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

打赏作者

鲸鱼编程pyhui 你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20

扫码支付：¥1

获取中

扫码支付

您的余额不足，请更换扫码支付或充值

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

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