Internet Explorer 9 の背景に svg 画像を使用すると奇妙な問題が発生します。
次のCSSルールをテストしました：
background-image: url(./grad.svg); /* local file */
background-image: url(http://127.0.0.1:7101/path/to/images/grad.png);
background-image: url(http://127.0.0.1:7101/path/to/images/grad.svg);
最初の 2 つのルールはうまく機能しますが、最後のルールは失敗します。F12 開発者ツールを(Pending...)使用すると、svg 画像が表示されます。URL を使用して画像に直接アクセスすると、IE9 で正しく表示されます。
Opera で 3 つのルールをすべて確認したところ、機能しました。
では、最後のルールのどこが間違っているのでしょうか?
//編集
さらに、次のルールをテストしました。
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc1MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0UzQTgyMCIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzUyNCkiIC8+Cjwvc3ZnPg==);
IE9 と Opera の両方で正常に動作しました
//編集2
私も次のことを試しました：
background-image: url(http://upload.wikimedia.org/wikipedia/commons/a/af/Android-System-Architecture.svg);
出来た！？