SVG不会在Safari中的img标签中显示

Question

简而言之,我有一个嵌入HTML的SVG图形,拒绝在Safari中显示(尽管它在Chrome,Firefox和其他浏览器中工作正常).

我正在使用以下标记来完成此任务:

<img alt="grapefruit logo" src="/assets/better-gf-logo_red.svg" />

这是SVG未显示的页面的实时链接.左上角的水果徽标不会显示在Safari中:https://grapefruit.cs.rpi.edu/.

我已验证以下行也存在于我的nginx中mime.types:

 image/svg+xml                         svg svgz;

但是,我知道这个问题可能与mime类型无关,因为SVG在我的开发机器上也没有出现在Safari中(我测试了几个Web服务器).我也试过在Safari中显示SVG文件,它看起来很好.图像元素具有正确的大小和框模型,但它不显示任何内容.

Answer 1

事实证明,这<img src="image.svg">在Safari中不起作用,我尝试使用<object>它并且有效.尝试一下:jsBin演示

<object
   type="image/svg+xml"
   height="70"
   width="150"
   data="/assets/better-gf-logo_red.svg">
</object>