如何测试类似modernizr.js的css属性

How to test for css properties like modernizr.js

本文关键字：css 属性 js modernizr 测试类      更新时间：2023-09-26

我想测试浏览器是否支持CSS属性。我知道我可以使用modernizr来做这件事，但我不想安装整个库来测试一个属性。

modernizr如何测试属性？假设我想测试对背景大小属性的支持。

我扫描了文档对象的属性，但没有看到任何看起来有帮助的内容。

任何想法或帮助都会很棒。

Modernizr的工作原理是创建一个元素，应用css属性，然后检查css属性的返回值。例如，如果你想测试文本阴影，你可以这样做：

if (document.createElement("detect").style.textShadow === "") {
    document.getElementsByTagName("html")[0].className += " textshadow";
}

我认为这将针对每个功能，因为您必须在DOM中查找某些副作用。以下是一些想法的链接http://www.sitepoint.com/detect-css3-property-browser-support/

Modernizr是一个开源项目，您可以查看为其提供动力的代码。这里是后台大小检测。

这是一件很琐碎的事情。创建一个dom元素，将background-size（香草和所有以供应商为前缀的版本）设置为100%，然后检查dom元素的style属性上的backgroundSize值，看看它是否保持了该值。

话虽如此，modernizr相当瘦。你只需要得到你想要的测试，什么都没有。

相关文章：