SVG 中的 PNG - 在 Firefox 中不起作用

Question

我正在尝试将 PNG 图像直接放入 SVG 文件中（使用 Base64）。这是一个演示：

<use href="#img1" transform="matrix(20,10,-5,20,50,50)" />

它在 Chrome 中工作正常，但在 Firefox 中不起作用。你知道问题出在哪里吗？

Answer 1

图片没有宽度和高度属性。 Firefox 仍然需要它们。

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="500" height="500">
  <defs>
    <image  id="img1"  href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="  width="5" height="5" />
  </defs>
  <use href="#img1" transform="matrix(20,10,-5,20,50,50)" />
</svg>

SVG 1.1 说它们是强制性的，SVG 2 规范说它们是可选的。

SVG 中的 PNG - 在 Firefox 中不起作用

PNG inside SVG - not working in Firefox

base64

svg

png