css - 某些 SVG 文件不适用于 Safari

Question

我通过 adobe illustrator 创建了 SVG 文件。但是这些文件在 Safari 上不起作用。它适用于 Chrome 和 Firefox。

你可以在这个网站看到:https://www.communityinviter.com/

Answer 1

Safari 在 svg 渲染上仍然存在一些问题，尝试将 embed 标签从 img 更改为:

<iframe src="your-svg.svg"></iframe>
<embed src="your-svg.svg" type="image/svg+xml"></embed>
<object data="your-svg.svg" type="image/svg+xml"></object>

或者简单地尝试包含您的 svg 内联:

<svg width:"10%" xmlns="http://www.w3.org/2000/svg">
</svg>

或使用 js modernizr 库(https://modernizr.com/)，您可以防止旧浏览器呈现错误或隐藏元素以这种方式显示 png:

if (!Modernizr.svg) {
    $(".yourimg").attr("src", "images/svg.png");
}