SVG, Safari'de img etiketinde görüntülenmiyor

Question

Basitçe söylemek gerekirse, HTML'de gömülü (Chrome, Firefox ve diğer tarayıcılarda iyi çalışıyor olmasına rağmen) Safari'de görüntülenmeyi reddeden bir SVG grafiği var.

Bunu gerçekleştirmek için şu işaretlemeyi kullanıyorum:

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

İşte SVG göstermiyor sayfaya canlı bağlantıdır. Sol üst köşedeki meyve logosu Safari'de görüntülenmiyor: https://grapefruit.cs.rpi.edu/. Ben aşağıdaki satırı doğruladıktan

Ayrıca benim nginx mime.types mevcuttur: Ancak

image/svg+xml       svg svgz; 

, ben SVG Safari'de görünmüyor çünkü bu konunun muhtemelen, mim türleriyle ilgili olmadığını biliyoruz geliştirme makinem de (birkaç web sunucusunu test ettim). Ayrıca Safari'de SVG file itself görüntülemeye çalıştım ve iyi görünüyor. Resim öğesi doğru boyut ve kutu modeline sahip, ancak herhangi bir içerik göstermiyor.

Answer 1

<img src="image.svg">'un Safari'de çalışmaz duruma geldiğinden, <object> kullanmayı denedim ve işe yaradı. o PNG (değil vektör) olan tek olarak kaydedilir - jsBin demo

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

tüm görüntünün

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/object

Answer 2

Önce bir metin editörü açın ve görebileceğiniz SVG
değil: Bu Bir deneyin SVG

... width="1640" height="422" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA... 

onay burada http://jsbin.com/kayiwe/