子選擇器不能正常工作（選擇不在直接子選擇器）

Question

我不知道爲什麼我的孩子選擇工作不正常。在我的示例中，只有直接<li>標籤應該具有紅色。但相反，所有<li>標籤都以紅色標記。

這是我的問題的jQuery的小提琴：

http://jsfiddle.net/5Jf4Y/2/

Answer 1

我的猜測是，無論你選擇具有相同的特異性+色彩屬性是繼承。

顏色屬性是繼承。

設置首先爲<li>元素的默認顏色，並應用不同的顏色直接孩子.courses > ul > li：

.courses ul li { 
    color: Black; 
    margin-left: 40px; 
}​ 

.courses > ul > li { 
    color: #9E002E; 
    font-size: 20px; 
} 

DEMO

Answer 2

嵌套的孩子繼承了父母的顏色，所以選擇不匹配實際上他們。給li一個默認的文本顏色修復了問題（注意CSS規則塊的順序，因爲它有所不同）。

演示：http://jsfiddle.net/5Jf4Y/6/