为flexbox订购供应商前缀的正确方法是什么？

Question

擦

CSS技巧说,顺序display供应商前缀Flexbox将是非常重要的,并显示一个排序(-webkit-box,-moz-box,-ms-flexbox,-webkit-flex,flex)
MDN示出的不同的顺序CSS技巧并交换-moz-box出去-moz-flex(-webkit-box,-webkit-flex,-moz-flex,-ms-flexbox,flex)
波旁示出了又一个不同的顺序,并带来了box,其中的其他两页甚至没有提到(-webkit-box,-moz-box,box,-webkit-flex,-moz-flex,-ms-flexbox,flex)

问题

Answer 1

只要W3C版本(官方财产)排在最后,就没有区别.

CSS渲染引擎将始终选择适用的最后一个属性.因此,如果实际支持Chrome,您不希望Chrome跳过flex并选择.-webkit-flexflex

你看到CSS-Tricks,MDN和Bourbon中供应商前缀的排序有所不同,因为顺序并不重要.请注意它们的共同之处:flex是最后一个.

以下是一些更多细节:

Answer 2

大多数情况下，供应商前缀的顺序并不那么重要，但请确保您使用的是最标准化的版本，方法是在末尾添加不带供应商前缀（仅是 flex）的版本。如果属性相等，CSS 总是优先考虑最后一个。

无论如何，现在最常见的浏览器都支持不带前缀的 Flex： http: //caniuse.com/#feat=flexbox。96%的浏览器可以使用flexbox，其中82%的浏览器支持不带前缀的flex。