[分享]css兼容前缀不管用

随着新的CSS规范不断推出，浏览器对CSS的支持也在不断增强。然而，一个普遍存在的问题是：CSS兼容前缀在某些情况下可能无效。 webkittransform: rotate(30deg); mozt...

随着新的CSS规范不断推出，浏览器对CSS的支持也在不断增强。然而，一个普遍存在的问题是：CSS兼容前缀在某些情况下可能无效。

-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
transform: rotate(30deg); 

例如，在上面的代码中，为了支持不同的浏览器，我们在属性前加了三个不同的兼容前缀。然而，可能会出现这种情况，即虽然加了这些前缀，但在某些浏览器中仍然无法正常工作。

这是因为有些浏览器可能已经支持了不带前缀的标准语法，同时忽略掉带有前缀的语法。或者，某些浏览器可能会忽略其中某个前缀，导致出现错误。

解决这个问题的方法是，先尝试不加任何兼容前缀，看看是否会影响浏览器的兼容性。如果需要加前缀，可以使用Autoprefixer这样的工具，根据不同的浏览器规则自动生成兼容前缀。

transform: rotate(30deg); 

如上所示，在编写CSS时，我们可以尽量不使用过多的兼容前缀，以免引起不必要的麻烦。