是否可以在 JavaScript 中知道客户端浏览器是否支持 CSS 属性？我说的是 CSS3 的旋转属性。我想仅在浏览器支持时执行某些功能。
使用 JavaScript 检查浏览器 CSS 属性支持？
IT技术
javascript
css
browser-feature-detection
2021-03-08 08:04:56
4个回答
我相信你可以这样做：
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!');
}
为此，有一个新的 DOM API CSS.supports。FF、Opera（支持CSS）和Chrome Canary 已经实现了这个方法。
为了跨浏览器兼容性，您可以使用我的CSS.supports polyfill
例子：
CSS.supports("display", "table");//IE<8 return false
但是，您仍然需要为 css 属性指定浏览器前缀。例如：
CSS.supports("-webkit-filter", "blur(10px)");
我建议使用Modernizr进行特征检测。
您可以使用Modernizr库。
css 转换示例：
在 .css 文件中；
.no-csstransforms .box { color: red; }
.csstransforms .box { color: green; }
在 .js 文件中；
if (Modernizr.csstransforms) {
// supported
} else {
// not-supported
}
可以试试这个吗？
var temp = document.createElement('div');
var isSupport = temp.style['propName'] != undefined;