广州搜索seo网站优化,自己做的网站与ie不兼容,品牌建设+网站,启用wordpress rest api原标题#xff1a;SVG的雷#xff0c;你踩过了没#xff1f;随着SVG互动布局的出现和在H5的应用越来越多#xff0c;不少小伙伴们会想在秀米里上传自己制作的SVG图形。秀米的首页顶部教程收录了一篇关于SVG图形的讲解#xff1a;「秀米的SVG图片」#xff0c;里面主要介绍…原标题SVG的雷你踩过了没随着SVG互动布局的出现和在H5的应用越来越多不少小伙伴们会想在秀米里上传自己制作的SVG图形。秀米的首页顶部教程收录了一篇关于SVG图形的讲解「秀米的SVG图片」里面主要介绍了SVG图形有放大缩小不失真的特性以及如何从Adobe Illustrator(下面简称Ai)导出“.svg”文件的方法。但是这个教程有两个地方没有展开讲解1、SVG是怎么构成的2、SVG有哪些使用禁忌SVG图片并不是单纯地把任意一个图片文件的后缀改成.svg就能转换出来的。秀米的小伙伴们在上传或者使用SVG的过程中经常会遇到像“该矢量图形中包含不支持的内容”“使用了过多SVG图形无法同步”这样的问题那么本篇就来给大家排排雷。01SVG如何构成熟知Ai或者其他矢量图制作工具的小伙伴应该比较了解制作一个矢量图形就是将多个锚点围成一个形状这个形状可以添加填充色或者是边框那么换句话说矢量图就是由多个锚点围成的一个或者多个形状的集合。矢量图和位图(常见的位图如JPG、PNG)最明显的区别就是矢量图有锚点而位图没有矢量图有锚点位图没有锚点常见的矢量图文件格式有 “.svg”、“.ai”、“.eps”而在秀米和公众号上适用的矢量图格式只有“.svg”。02SVG有哪些使用禁忌锚点特别多的SVG不能用每一篇公众号图文其实相当于一个网页页面除了表面上能看到的正文字数之外其实公众号图文还会统计背后的代码字数。不少小伙伴在使用了一些复杂SVG图形后同步到公众号时会出现这样一个提示这时小伙伴可能会纳闷我既没有写太多的字数也没有用过多图形怎么就无法同步呢如果是用了SVG图形出现了这个报错但却又不是因为用了过多的SVG图形那么绝对是因为所用的SVG图形包含了过多的锚点。有些锚点很复杂的SVG图形表面上看起来是这样的光看着就有数不清的锚点而这些锚点的html代码形式更是夸张这一个花的SVG代码多达两万多字别说网页会崩溃我看着都崩溃了虽然举了个夸张的例子可能一般情况下也碰不着但还是奉劝大家尽量不要用锚点过于复杂的SVG图形。SVG的描边是无法改色的有些小伙伴在制作SVG图形时会给图形加上描边例如像下方的星星图形有一圈黑色的描边当这个图形上传到秀米后描边是可以正常显示的但是在秀米的SVG换色功能里却不能改色。如果希望描边是可以改色的话解决方法很简单。在Ai里选中这个图形然后执行对象→路径→轮廓化描边这个操作可以让原来的描边转变成图形上传到秀米后就能改色了。SVG不支持字体小伙伴制作的SVG图形中可能包含了一些未转化成轮廓的文字。大多数字体在秀米和微信公众号上都是不支持的但如果想在SVG图形中保留字体的话可以给文字创建轮廓。在Ai创建字体轮廓的方法是选中文字右键菜单中选择“创建轮廓”温馨提醒各位使用字体前记得了解清楚这款字体是否可商用哦。SVG中不能包含位图和剪切蒙板有些小伙伴可能会用到一些带图案的JPG或者是PNG格式的图片作为SVG图形的底纹虽然生成的文件是“.svg”没错但是网页上不支持含有位图的“.svg”格式。同样的将一个JPG或者是PNG文件强行保存为SVG文件也是不可行的请务必记住这句话网页上只能识别SVG图形中的锚点以及填充色同样在SVG格式中不支持的内容还有“剪切蒙板”。例如有些图形用了剪切蒙板来裁剪那么你只能释放剪切蒙板释放剪切蒙板后下一步就想办法做个一样的小结SVG图形是由多个锚点围成一个或者是多个图形的集合制作SVG的时候尽量不要用过多的锚点图形的描边以及字体可以在Ai中先轮廓化之后再使用。位图和剪切蒙板SVG图形中是不支持的切记只有锚点和图形的填充色能被网页识别。看完这篇排雷帖如果想继续了解如何从Ai导出SVG的话可以继续阅读下方这份陈年旧帖秀米的SVG图片模板精选急诊更新支招不点“好看”领导怎么知道你上进返回搜狐查看更多责任编辑
