SVG <image> 标签在 Safari 和 Firefox 中不起作用答案

【问题标题】：SVG <image> tag not working in Safari and FirefoxSVG <image> 标签在 Safari 和 Firefox 中不起作用
【发布时间】：2016-07-23 07:18:34
【问题描述】：

我的问题如下：由于<image> 标签，我尝试在 SVG 部分显示图像。以下代码为示例。

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink">
    <image xlink:href="http://2.bp.blogspot.com/-auWhmIJyACw/TaHzOV8pN1I/AAAAAAAAAPY/2nGmNaJRaBs/s1600/roger-federer-widescreen-wallpaper-001.jpg" preserveAspectRatio="xMinYMin slice"></image>
</svg>

我的问题是它不适用于 Safari 和 Firefox。它似乎来自不起作用的图像标签。不知道是语法错误还是xlink错误。

如果您想进行测试，可以使用 codepen：http://codepen.io/vavouweb/pen/VaMNqg

【问题讨论】：

标签： html image firefox svg safari

【解决方案1】：

在 SVG 1.1 中，图像的宽度和高度属性是强制性的。

未完成的 SVG 2 规范建议删除该要求，但据我所知，目前只有 Chrome 和可能的 IE edge 实施了该建议。

【讨论】：