内联 SVG 在 IE 中不能用作背景图像答案

【问题标题】：Inline SVG not working as background-image in IE内联 SVG 在 IE 中不能用作背景图像
【发布时间】：2013-06-20 14:43:54
【问题描述】：

我正在尝试将background-image css 属性设置为编码数据 URI 内容，如 in this fiddle 所示

它对我测试的所有浏览器都按预期工作。唯一不显示内容的浏览器是 IE 9/10。

但我有在 IE 9/10 中工作的 another example。这里的区别在于数据 URI 内容最初是在 Chrome 中创建的（由 Raphaël），然后在示例中使用。

如果 SVG 是在 IE 中创建的（如 Raphaël 的第一个小提琴）本身，如果用作 background-image 数据，则它不会被显示。

IE 的问题在哪里？是否与我的代码有关，或者 Raphaël SVG 绘画中可能出现问题？

【问题讨论】：

【解决方案1】：

看起来最能跨浏览器兼容的方法（也是让 IE 将 SVG 显示为 CSS 背景的唯一方法）是像您在第一个小提琴中所做的那样对 SVG 进行 base64 编码（又名 dataURI） .

我发现本文底部的 cmets 讨论很有帮助

【讨论】：