preserve 相关问题


SVG 可以有多小?

我刚刚缩小了这个SVG: 我刚刚缩小了这个 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 宽度高度”,除非 viewBox 已经存在。 删除 background-color 将意味着 SVG 当放置在其他东西之上时将不再是不透明的。当然,如果你不这样做,你可能不会注意到。 仅当 SVG 文件中有文本元素时,xml:space 属性才重要。 如果 SVG 是内联的,其余的删除都是良性的。如果 SVG 是独立文件,则需要命名空间属性,但背景图像就是这种情况。 简化版本不是有效的 SVG。它将被视为“任何”恰好具有名称为“svg”的根元素的 XML。 要将片段转换为 the SVG,只有一个选项: 将具有正确命名空间的 xmlns 属性添加到 svg 元素(正如您所发现的) 不再建议在文档中添加 DOCTYPE,并且从 Chrome 53 起就不起作用。将文档作为 MIME 类型 image/svg+xml 提供服务也不够。 示例: <svg xmlns="http://www.w3.org/2000/svg">(消费者选择的SVG版本) <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">(适用于 SVG 1.0) 使用W3验证器检查您的文件。请务必检查检测到的文档类型是否为 SVG,因为该文档可能仍然有效,但作为一般/未知的 XML。 -- 他们还有测试页面。


© www.soinside.com 2019 - 2024. All rights reserved.