Img与svg扩展不显示在Safari(适用于Chrome + Firefox)

Question

目前有以下代码与svg扩展的图像源，在Chrome和Firefox中工作良好，图像不出现在Safari中，即使添加了"onerror":

 <li><img src="/assets/ResnateThickerSquare.svg", onerror="/assets/ResnateLiHome.png", onclick="home()", id="homeSquare"></li>

假设这是由于svg扩展，尝试以下建议从这个stackoverflow问题(我使用，

<li><object data="/assets/ResnateThickerHome.png" type="image/svg+xml", onclick="home()" , id="homeSquare"><img src="/assets/ResnateLiHome.png"></object></li>

同样，它可以在Chrome + Firefox中工作，但不能在Safari中工作。我应该避开img和对象的svg标签按照这个问题:svg与图像里面是不显示在safari(我的印象是，标签是为svg多边形保留，而不是图像?)?

Answer 1

参考此链接查看我们的safari是否满足svg的要求

http://caniuse.com/svg

我在stackoverflow上发现了这个

如果你的浏览器支持仍然错误尝试这个

<svg width="500" height="220" xmlns="http://www.w3.org/2000/svg" version="1.1">
        <rect x="2" y="2" width="496" height="216" stroke="#000" stroke-width="2px" fill="transparent"></rect>
      </svg>

Answer 2

错误是将。png.svg作为文件扩展名，将其更改为。svg，现在它出现在Safari中