规则中不同风格的顺序是否重要？

Question

我注意到，当我查看规则时，我写了例如：

label { 
font-size: 12px; 
position: absolute; 
padding: 9px;
color: #666;
}

在萤火虫中，它翻译为：

label {
color: #666; 
font-size: 12px; 
padding: 9px;
position: absolute; 
}

基本上，重新排序样式。为什么呢？

我可以在我的风格中加入“终极”优先级以提高加载速度吗？即有一个我不知道的加载顺序？

Answer 1

规则中的样式顺序无关紧要。 Firebug似乎按字母顺序排序（可能是偶然的）。

当然，订单会在这个有问题的案例中发挥作用：

.foo {
    background: url(foo.png) top left repeat-x;
    background-image: url(bar.png);
}

Answer 2

是的，订单很重要：

label { 
font-size: 12px; 
position: absolute; 
padding: 9px;
color: #666;
font-size: 15px; 
}

font-size（15px）将否决12px

Answer 3

一般而言：是的，订单在实际设置的属性方面确实很重要。

您可以通过Google获取有关CSS优先级的许多链接，例如：

http://www.vanseodesign.com/css/css-specificity-inheritance-cascaade/

但就您在调试器中看到的内容而言 - 这对于CSS实际呈现的方式并不重要。此特定类中“color”，“font-size”，“padding”和“position”的顺序只是Firebug的一个神器。

Answer 4

嗯，正如其他人之前所说，顺序对于让浏览器选择使用哪个规则很重要，但是为了表现，我还没有听说过这样的事情。由于CSS只是一个文本文件，因此下载速度不会受到影响。 BUt我认为没有人用一些测试用例来检查这个主题。