vue-element-admin之修改侧边栏的icon图标以及图标颜色

1.修改侧边栏的icon图标 👇

如果在admin提供的icon库中没有你需要的图标,可以到https://www.iconfont.cn/上选择并生成自己的业务图标库
在admin指南中可以看到这句话,我们来实际操作一波
在这里插入图片描述
打开网址后,可以看到
在这里插入图片描述
在图标库里可以搜索我们需要的图标
在图标库里可以搜索我们需要的图标
搜索之后,点击下载,就下载到我们的文件夹中了,可以在文件中找到它,给它重命名
在这里插入图片描述
在这里插入图片描述
打开我们的项目只要把它复制到icon中的svg下面,就有我们自己的图标了
在这里插入图片描述
引入即可
在这里插入图片描述

2.修改图标的颜色,随着点击的字体颜色改变 👇

找到需要改变的图标svg,打开,在最后面可以看到一项
在这里插入图片描述
把fill去掉就可以了,另外,如果你的UI给到你的 svg本身带有颜色,那么是改不了颜色的,需要将你的svg上传到iconfont(阿里巴巴矢量图标库),编辑去除颜色,然后下载再使用即可

  • 8
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 13
    评论
评论 13
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值