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

Question

问题是如何使用Modernizr来检测是否支持SVG CSS背景？

.svg #example{} 不是正确的方法,因为不同的浏览器对svg文件有不同的支持.

例如,Modernizr报告在firefox 3.5中支持SVG,但不支持SVG文件和CSS作为背景图像.

Answer 1

纯 CSS 解决方案怎么样？我可以确认这适用于 IE8。

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

http://www.broken-links.com/2010/06/14/using-svg-in-backgrounds-with-png-fallback/

或者尝试其他方法：

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

http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique