订购特定于供应商的CSS声明

我想我现在已经写了如下几千遍：

.foo { border-radius: 10px; /* W3C */ -moz-border-radius: 10px; /* Mozilla */ -webkit-border-radius: 10px; /* Webkit */ } 

但是现在我才想到这些sorting是否重要？ 我知道在-moz-*和-webkit-*之间是没有关系的，因为其中最多只有1个会被读取，但是如果要先做W3C标准还是比较好的 （在未来的发展等方面）持续？

Answer 1

最好的做法是毫无疑问地把前置前提：

 .foo { -moz-border-radius: 10px; /* Mozilla */ -webkit-border-radius: 10px; /* Webkit */ border-radius: 10px; /* W3C */ } 

无论哪一个是最后出来的-webkit-border-radius和border-radius将会被使用。

-webkit-border-radius是“实验”属性 – 实现可能包含与规范的偏差。 border-radius的实现应该与规范中的内容相匹配。

当W3C实现可用时，最好使用W3C实现 ，以帮助确保所有支持它的浏览器之间的一致性。

Answer 2

订购是重要的。 为了将来能够validation您的代码，您需要使W3C规范成为最后一个版本，所以级联优先于供应商的前缀版本。

 .foo { -moz-border-radius: 10px; /* Mozilla */ -webkit-border-radius: 10px; /* Webkit */ border-radius: 10px; /* W3C */ } 

例如，我们可以说Google Chrome支持border-radius ，但它也支持-webkit-border-radius以便与之前的版本兼容。 当Chrome遇到这个.foo类的时候，它会首先看到-webkit，然后它会看到标准，并默认为标准（而忽略webkit）。