测试不支持Mock CSS属性？

Question

我需要测试我的网站，好像不支持不同的CSS属性。有没有办法可以禁用某些属性的支持，比如3D变换？

Answer 1

这是一种hacky解决方案，但您可以使用通用选择器将所有元素重置为属性的默认值，并使用!important。只要您不在代码中使用!important，这应该是一个非常准确的模拟。

示例（禁用transform）：

* {
    -webkit-transform: none !important;
       -moz-transform: none !important;
        -ms-transform: none !important;
         -o-transform: none !important;
            transform: none !important;
}

您甚至可以从浏览器开发人员工具中注入此代码。

不幸的是，这不适用于受支持属性的子集。

Answer 2

总之，可能不是。但是您可以通过使用结构化CSS（可能是LESS / SASS）文件来模拟这个，因此您可以简单地禁用大块规则来查看它的外观。

如果您的目标是简单地了解它在旧版浏览器中的反应，那么这不是最好的模拟 - 它更具学术性。相反，您可能希望使用众多系统之一来为您测试网页并向您发送输出。

Answer 3

最简单，最快速和最可靠的解决方案是使用旧版本的浏览器 - 因为这是最不可能支持各种CSS属性的真实场景。

例如：您可以在此处找到旧版Chrome（Windows）:(包括1.0之前的测试版）http://www.oldversion.com/windows/google-chrome/

Answer 4

我的建议是在真实浏览器中测试CSS属性。我知道在您的计算机上安装所有需要的浏览器测试版本几乎是不可能的，因此有一个很好的Web服务可以提供测试环境：

• https://www.browserstack.com/

此外，您可以在以下位置查看CSS可用性：

• http://caniuse.com/