1. 首页
  2. 前端

Iconfont(阿里巴巴矢量图标库)上传svg图标显示空白的解决方法

在工作中,我们做项目时使用Iconfont提供的图标库,有时在上面却找不到合适的字体图标,这时就需要我们自己设计svg图标并且上传到Iconfont中的项目里面去,然后在项目中直接使用。

然而,有时候我们明明用AI做好了svg格式的图标,上传图标的时候,发现上传上去却是个空白,或者部分内容不见了,如图:

Iconfont(阿里巴巴矢量图标库)上传svg图标显示空白的解决方法

网上好多小伙伴遇到过此问题,但是对该问题的解答却是千奇百怪,没有一个正确的。

其实出现这个现象的原因很简单:这是因为用AI软件设计的图标中,有好多的元素,并且存在好多不同的类型,如文字、符号、笔刷、外观效果、图形等等,我们只需要把它们转换成单一的基本类型即可。

解决方法如下:
选中所有的图层元素,点击“对象”——>”扩展”,在弹出的窗口中直接点“确定”即可解决该问题。

Iconfont(阿里巴巴矢量图标库)上传svg图标显示空白的解决方法Iconfont(阿里巴巴矢量图标库)上传svg图标显示空白的解决方法
说明:
扩展是指把一些内容变成单纯的路径、填充。 ai里有很多种类型的元素,例如文字、符号、笔刷、外观效果、等等。还有最基本的一种元素就是路径、填充。扩展就是把上述类型,变成基本类型。

原创文章,作者:Ferrycoln,如若转载,请注明出处:https://ms200.cn/archives/1104

发表评论

邮箱地址不会被公开。 必填项已用*标注

联系我们

在线咨询:点击这里给我发消息

邮件:499661635@qq.com.com

工作时间:周一至周五,9:30-18:30

QR code