如何使用Modernizer检测是否支持SVG CSS背景？

正如问题所说，我如何使用Modernizer来检测是否支持SVG CSS背景

.svg#示例{}

不是正确的方法，因为不同的浏览器对svg文件有不同的支持

---

例如，Modernizr报告firefox 3.5支持SVG，但不支持SVG文件和CSS作为背景图像。

纯CSS解决方案如何？我可以用IE8确认这一点

E {
background-image:  url('image.png');
background-image:  none, url('image.svg'), url('image.png');
background-size: 100% 100%;
}

或者尝试其他方法：

E {
background: transparent url(fallback-image.png) center center no-repeat;
background-image: linear-gradient(transparent, transparent), url(vector-image.svg);
}

---

一个选项是在modernizer中使用内联SVG选项。我可以在FF 3.6.14中确认这一点。您可以选择“内联SVG”作为modernizer构建的一部分，并可以在CSS中对其进行管理，如：

.logo {
    background: url(mahimage.svg);
    ...
}

.no-inlinesvg .logo {
    background: url(mahimage.png);
    ...
}

或者使用javascript，比如：

if (Modernizr.inlinesvg) {
    ...
}
else {
    ....
}

---

第一种方法的问题（正如您在链接的帖子中所指出的）是svg不能有透明的背景，否则png回退将显示出来。