CSS屬性命令的位置是否重要？

Question

這可能看起來像一個簡單的問題，但我想知道如何在單個選擇器中定位屬性，例如：display第一個或width第一個等;貝婁是例子，位置與造型混合在一起，真的到處都是。

.box { 
    display:block; 
    width:100px; 
    background-color:blue; 
    margin:25px; 
    position:absolute 
} 

• 是否真的重要？
  
• 我們應該遵循什麼指導原則？

感謝，

Answer 1

這真的是品味和風格的問題，大部分。如果你找到它們，有很多指導方針可供選擇，但是一個地方是Nicolas Gallagher的Idiomatic CSS - 特別是Declaration Order部分。

如果要始終排列聲明，應該遵循一個簡單的原則。

...

較小的團隊可能更願意聚集相關的屬性（例如定位和盒模型）在一起。

...

大型的團隊可能更喜歡簡單性和易用性的mainteance自帶的字母順序。

Answer 2

屬性的順序並不重要（在技術意義上），除非他們：

• 是相同的屬性（包括供應商前綴版本）
• 一個屬性是一個簡寫屬性，包括其他

例如：

background: url('foo'); 
background-color: red; 

和

background-color: red; 
background: url('foo'); 

...會給出不同的結果（因爲如果省略background屬性它被視爲transparent的background-color部分）。