阿里iconfont图标不能修改颜色的解决方案

现象:iconfont安装后的图标,是经过symbol引用方式,有的图标不能经过color修改颜色的解决办法,有的又能够。

<svg class="icon" aria-hidden="true" style="color:red;">
    <use xlink:href="#icon-PDF"></use>
</svg>
复制代码

缘由:

当从阿里图库中图标被添加至项目,若是编辑过项目图标的颜色或者图标自己是有颜色的,那么在经过symbol获取图标时会在svg的path中增长fill属性,致使没法更改颜色,若是须要动态修改颜色,须要重新添加该图标(自己图标无色),获取在symbol的js文件中程序删除fill属性。正则表达式

解决办法:


==1. 下载Js文件后,用Notepad++打开,而后用正则表达式查找:fill="#......" ,替换。==bash

==2. iconfont.cn上,全选项目中的文件,应用批量操做-->批量去色==svg

https://user-gold-cdn.xitu.io/2019/4/20/16a39f57970437dc?w=652&h=310&f=jpeg&s=21323
相关文章
相关标签/搜索