不支持测试的模拟CSS属性？

Question

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

Answer 1

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

例如：你可以找到Chrome浏览器（Windows）中的旧版本在这里：（包括预测试版1.0）http://www.oldversion.com/windows/google-chrome/

Answer 2

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

如果你的目标是简单地看看它如何在旧版浏览器中作出反应，那么这不是最好的模拟 - 它是相当学术的。相反，您可能想要使用将为您测试网页并向您发送输出的许多系统之一。

Answer 3

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

例（禁用transform）：

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

你甚至可以从你的浏览器开发者工具注入的代码。

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

Answer 4

我的建议是在真正的浏览器测试CSS属性。我知道这可能是几乎不可能得到在计算机上安装所有需要的浏览器测试版本，所以有一个很好的网络服务，提供了一个测试环境：

• https://www.browserstack.com/

此外，您可以检查CSS可用性：

• http://caniuse.com/