svg图像不能在safari 5.1.7（windows）

svg图像不能在safari 5.1.7（windows）下工作。但是当我在safari中打开svg图像然后访问该网站时，图像显示在那里。svg图像不能在safari 5.1.7（windows）

2016-09-20 Cspk Isb

请更清楚你的问题是什么。 “不工作”是什么意思？你说“访问该网站” - 什么网站？ –

我正在开发一个网站，其中我使用svg图像，就像这个，现在，当我访问该网站的铬工作正常，但在Safari浏览器中访问它时，svg图像不显示在那里。但是，如果我在safari中打开svg图像，那么它将显示在网站中。 –

你的意思是，如果你直接加载SVG（例如www.my.site/somefile.svg），那么之前没有显示的图像现在开始工作？ –

Windows上的Safari浏览器出现了计算响应式内联SVG高度的已知问题。

您可能尝试intrinsic ratio技术，由此你绝对位置的<object>标签与底部填充等于viewBox的SVG的比率（或高度/宽度属性）内的<svg>标签。

.my-responsive-svg { 
 
    width: 100%; 
 
    display: block; 
 
    height: auto; 
 
    position: relative; 
 
    /* for an svg with a 16:9 aspect ratio */ 
 
    padding-top: 56.25%; 
 
} 
 

 
.my-responsive-svg svg { 
 
    width: 100%; 
 
    height: 100%; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    right: 0; 
 
}

<object class="my-responsive-svg"> 
 
    <svg width="160" height="90" viewBox="0 0 160 90"> 
 
    <rect x="10" y="10" width="140" height="70" /> 
 
    </svg> 
 
</object>

来源：帽尖塞尔希奥·洛佩斯谁在this blog post评论。

来源

2017-06-09 13:02:48 JamesWilson

svg图像不能在safari 5.1.7（windows）

回答

相关问题