某些 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");
}