CSS - 優先CSS規則

Question

我有一個項目表與奇數和偶數行着色爲更好的視野：

tr:nth-child(even) {background: #CCC} 
tr:nth-child(odd) {background: #FFF} 

我也有檢查一個代碼，如果該項目是晚，如果是這樣的i顏色全部項目排成紅色（而不是偶數行和奇數行的通常着色）

此外，每行都有一個類，並且類名取決於項目是否延遲。 的類別是：

.redBackground {background-color:#CD5C5C;} 

.yellowBackground {background-color:#FFFF00;} 

.noBackground {} 

的問題是，該行具有一流不管，偶數奇數行的CSS總是「贏」，所以我從來沒有看到紅色或黃色的背景。 我如何讓它工作，以便在遲到的日期的情況下，它會顯示紅色和黃色的類，並在正常情況下，它會是奇數或甚至？

Answer 1

使用選擇具有較高specificity，例如嘗試

table tr.redBackground {background-color:#CD5C5C;} 

Answer 2

使用!important

.redBackground {background-color:#CD5C5C !important;} 

.yellowBackground {background-color:#FFFF00 !important;} 

Answer 3

您可以使用家長選擇，您的情況下，這應該工作：

tr.redBackground {background-color:#CD5C5C;} 

tr.yellowBackground {background-color:#FFFF00;} 

或者，

#parent_div .redBackground {background-color:#CD5C5C;} 

#parent_div .yellowBackground {background-color:#FFFF00;} 

Answer 4

爲什麼不這樣做的Java腳本。假設你知道哪些行是爲了以後的項目。

if(project is late){ 

    document.getElementById("MyElement").className = "redBackground"; 

} 

保持默認類爲奇數和偶數，並在晚期項目更改類的情況下。假設您不介意以編程方式更改課程。