即使在Internet Explorer中，您是否可以將svg圖像顯示爲背景？

我使用SVG圖像作爲背景圖像。我的CSS看起來是這樣的：即使在Internet Explorer中，您是否可以將svg圖像顯示爲背景？

background:url('image.svg');

的問題是，它們不會出現IE8的或更早。

有什麼辦法可以使這項工作？或者也許只爲IE指定一個回退？（我不想用GIF，其他瀏覽器來代替它們。）

活生生的例子：HERE

來源

2012-02-03 emersonthis

有沒有辦法，我知道的，使IE8使用SVG作爲背景圖像。你有兩個真正的選擇，如果IE8的支持是非常重要的你：

爲IE8和其他瀏覽器不支持在後臺SVG
放置SVG在你的頁面，而不是背景，地位提供a PNG fallback這一切與CSS的身後，然後使用類似SVG Web在IE8

來源

2012-02-03 23:56:00 robertc

這真的很有幫助。這完全是我一直在尋找的東西。不幸的是，對於這個項目來說選項＃1有點太不好，正如你指出的＃2似乎要求SVG圖像是在HTML而不是CSS背景。我可能不走運。在我放棄思想之前，我才知道Modernizr可以測試SVG支持。所以這最終可能會取得豐碩的成果。感謝鼓舞這一探索方向。 – emersonthis 2012-02-04 14:23:59

提供支持我有同樣的問題，使用this solution。爲了這個工作，你需要有一個svg和png副本的圖像。比寫CSS是這樣的：

.twitter-logo { 
    width: 200px; 
    height: 200px; 
    background: url(http://cl.ly/D4xT/twitter_newbird_blue.png) no-repeat center center; 
    background: rgba(0,0,0,0) url(http://cl.ly/D4o5/twitter_newbird_blue.svg) no-repeat center center; 
}

訣竅是，IE8 doesn't support rgba和正因爲如此IE8忽略第二個背景定義。

據svg support in other browsers，你會仍然有問題與Android瀏覽器2.3-和火狐3.6因爲支持RGBA，不支持SVG。

這裏是jsfiddle example以及。

來源

2012-08-28 09:41:57 dugokontov

即使在Internet Explorer中，您是否可以將svg圖像顯示爲背景？

回答

相關問題