我只是减少了这个SVG:
<?xml version="1.0" standalone="no"?>
<svg viewBox="0 0 480 150" style="background-color:#ffffff00" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" x="0px" y="0px" width="480" height="150">
<path d="M 0 35.5 L 6.5 22.5 L 16 37 L 23 24 L 34.8 43.7 L 42.5 30 L 50.3 47 L 59.7 27.7 L 69 47 L 85 17.7 L 98.3 39 L 113 9.7 L 127.7 42.3 L 136.3 23.7 L 147 44.3 L 158.3 20.3 L 170.3 40.3 L 177.7 25.7 L 189.7 43 L 199.7 21 L 207.7 35 L 219 11 L 233 37 L 240.3 23.7 L 251 43 L 263 18.3 L 272.7 33.3 L 283 10 L 295 32.3 L 301.3 23 L 311.7 37 L 323.7 7.7 L 339.3 39 L 346.3 25.7 L 356.3 42.3 L 369.7 15 L 376.3 25.7 L 384 9 L 393 28.3 L 400.3 19 L 411.7 38.3 L 421 21 L 434.3 43 L 445 25 L 453 36.3 L 464.3 18.3 L 476.2 40.3 L 480 33.5 L 480 215 L 0 215 L 0 35.5 Z" fill="#175720"/>
</svg>
对此:
<svg height="150" width="480"><path d="m0 35.5l6.5-13 9.5 14.5 7-13 11.8 19.7 7.7-13.7 7.8 17 9.4-19.3 9.3 19.3 16-29.3 13.3 21.3 14.7-29.3 14.7 32.6 8.6-18.6 10.7 20.6 11.3-24 12 20 7.4-14.6 12 17.3 10-22 8 14 11.3-24 14 26 7.3-13.3 10.7 19.3 12-24.7 9.7 15 10.3-23.3 12 22.3 6.3-9.3 10.4 14 12-29.3 15.6 31.3 7-13.3 10 16.6 13.4-27.3 6.6 10.7 7.7-16.7 9 19.3 7.3-9.3 11.4 19.3 9.3-17.3 13.3 22 10.7-18 8 11.3 11.3-18 11.9 22 3.8-6.8v181.5h-480v-179.5z" fill="#175720"/></svg>
(我通过最小化器运行它,然后删除了<svg>
标记中的一堆属性。)我将其用作背景图像,它似乎在Windows上的IE,Firefox和Chrome中都可以正常工作。我只是想知道,如果其他信息对图像外观没有影响,那么其他所有信息在做什么。因为我删除了该信息,某些地方会存在兼容性问题吗?
更新:我发现实际上,对于我的用例,我需要拥有xmlns="http://www.w3.org/2000/svg"
它,否则它将无法在IE或Chrome中呈现。
viewBox
由于SVG将不再缩放(即响应UA调整大小),因此删除会产生重大的语义差异。仅当您直接查看图像时才适用,尽管如果您以背景图像或通过SVG<image>
标签或html<img>
标签查看图像,则将绘制SVG,就好像其具有viewBox
“ 0 0 width height”一样,除非一个viewBox
已经存在。
删除background-color
遗嘱意味着将SVG放置在其他物体之上时将不再不透明。当然,如果您不这样做,可能不会注意到。
xml:space
仅当SVG文件中包含文本元素时,此属性才重要。
如果SVG是内联的,则其余删除项将是无害的。如果SVG是一个独立文件,则需要命名空间属性,尽管背景图像会是这样。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句