使用JavaScript检查浏览器CSS属性支持？

是否有可能在JavaScript中知道客户端浏览器是否支持CSS属性？我在谈论CSS3的旋转属性.我想只在浏览器支持它们时才执行某些功能.

1> Jamland..：

---

我相信你可以这样做:

if ('WebkitTransform' in document.body.style 
 || 'MozTransform' in document.body.style 
 || 'OTransform' in document.body.style 
 || 'transform' in document.body.style) 
{
    alert('I can Rotate!');
}

---

可能值得注意的是，这从技术上测试了浏览器是否支持CSS3的“ transform”样式，而不是专门的“ rotate（）” [transform function]（https://developer.mozilla.org/zh-CN/docs/Web / CSS / transform＃CSS_transform_functions）。根据我的（有限的）经验，前者始终暗含后者，但是我不确定这是否是一个可靠的假设（请参阅[此问题]（http://stackoverflow.com/questions/23528176/do-all-browsers -that-support-css3-transforms-support-all-transform-function））。

2> termi..：

---

为此目的,有一个新的DOM API CSS.supports.FF,Opera(作为supportCSS)和Chrome Canary已经实现了这种方法.

对于跨浏览器兼容性,您可以使用我的CSS.supports polyfill

例:

CSS.supports("display", "table");//IE<8 return false

但是,您仍需要为css属性添加前缀来指定浏览器前缀.例如:

CSS.supports("-webkit-filter", "blur(10px)");

我建议使用Modernizr进行特征检测.