iOS WebKit 中的透明 SVG
WebKit 有一个错误，导致嵌入的 SVG（通过 或
它已得到纠正，但在 iOS 上没有，因为 iOS 上有更旧的 WebKit 版本，
对此有一些好的解决方法吗？我非常需要透明背景。
我知道两个次优的解决方法：
使用
用自身屏蔽
有什么好的解决方案吗？
WebKit had a bug that caused embedded SVG (by <embed> or <image>) to have white background instead of transparent.
It was corrected, but not on iOS, where there is much older build of WebKit
Is there some good workaround for this? I desperately need the transparent background.
I know two sub-optimal workarounds:
Use
<img>tag. - I can not do that, because the DOM/XML tree of SVGs inserted as imgs can't be traversed/manipulated.Mask the
<object>or<embed>element with itself. Surprisingly, event the old WebKit can detect the transparency if the SVG is used as mask However I consider it an ugly solution:<object style="-webkit-mask-image:url(image.svg);" data="image.svg" type="image/svg+xml" />
Is there some good solution to this?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
我找到了解决方案。
我可以使用内联 SVG/XML。在这种情况下，我可以获得透明度和遍历 SVG DOM 节点的能力。
唯一的缺点是我必须使用有效的 XML 标记和正确的内容类型标头（
text/xml不知何故效果最好，我不知道为什么）I found a solution.
I can use inline SVG/XML. In that case I get both transparency and the ability to traverse SVG DOM nodes.
The only disadvantage is that I have to use valid XML markup with correct Content-type headers (
text/xmlsomehow works best, I don't know why)你所说的错误是众所周知的。如果是在 iOS 上，你真的需要使用矢量图形吗？为什么不使用具有继承透明度的 PNG？
The bug you are talking about is well known. If it is on iOS, do you really need to be using vector graphics? Why not use a PNG with inherit transparency?