Css規則應用程序訂單

Question

這篇文章（儘管它是基於一個事實導致我在工作中遇到麻煩）更多的是哲學問題而不是真正的問題提交。

我碰到這個令人費解之後震盪下跌的情況下...

這是不是真的，因爲我（我認爲）理解這一現象的一個問題，它是如何統治，它有效果。

我做了以下示例：http://jsfiddle.net/q7xAn/儘可能描述。

在這種情況下，爲什麼（Ô上帝爲什麼）跨度有黃色背景？

我不知道哪個規則適用於它，但更多的是：在其名稱中扭曲（與我總是假設的相反）最後一條聲明規則是否適用於第一條聲明？

我的意思是「.red span」和「.yellow span」具有相同的複雜度。

• 相同長度
• 每個項目在給定位置具有相同的權重/重要性

它們在CSS選擇自然順序等同。

然後，在適用的問題上應該遵循的是哪條規則最貼近樣式的項目。 在我的示例中，跨度應該用'.red span'（最接近的規則）而不是'.yellow span'（它也是正確的，但被'.red span''覆蓋'）。

這種行爲是否存在「歷史性」，「政治性」，「哲學性」或任何其他原因？ 可能會強制我正在尋找的行爲的一些DOCTYPES（可能是？）嗎？ 我可以向w3c提交請求（爲什麼不？）？怎麼樣 ？ 任何信息，建議，不同的觀點，都比歡迎！

感謝所有提前。

---

Edit note : 

我不想引用自己，但在註釋艾默裏克，我想出一個好辦法來解釋我的問話真的是什麼。

---

總的來說，如果我有，讓我們說7種顏色方案（每種彩虹顏色）。

還假設我是一個團隊（比方說）10人的css製造商。

我希望他們（我的團隊）能夠嵌套顏色方案塊。

• 在一種情況下，紅色的塊會包含黃色和洋紅色的塊。
• 在其他（有趣的）情況下，人們希望有7層嵌套（紅色嵌套在嵌套爲黃色的橙色嵌套在...）。

我現在沒辦法事先決定需要哪種用法。

當前CSS經歷的行爲會強迫我改造我的CSS 每一次新嵌套需要彈出與令人討厭過於臃腫的規則來結束。
在維護這方面是一種暴行：「（

Answer 1

這裏是一個article（不是真的，但最近明確），這也解釋了（如果我沒有誤解你的問題）回答您尋找

有關。例如，如果您更換：

.red span, .red{ 
background-color: #F00 
} 

人：

.yellow .red span, .red{ 
    background-color: #F00 
} 

你的背景將是紅

問候。

Answer 2

其被稱爲specificity的css。如果兩個選擇器與特定元素匹配並且它們具有相同的weight，則出現later的選擇器將應用於該元素。

閱讀this瞭解更多信息。

你選擇.red span和.yellow span都有0,1,1等應用最後一個規則（我提到會詳細說明如何計算權重的鏈接）的重量。

還讀了this來自W3的文章，這將更好地解釋事情。

希望一切都有所瞭解:)