與第n個孩子過規則元素

Question

.list_td:nth-child(even) { 
    background:rgba(0,0,0,0.04); 
} 

.overlay { 
    background:rgba(240,0,92,0.4); 
    color:#530724; 
} 

<td class="list_td overlay"></td> 

如何通過list_td:nth-child overule overlay不使用!important

Answer 1

讓規則更加具體：

.list_td.overlay { 
    background: rgba(240, 0, 92, 0.4); 
    color: #530724; 
} 

在這種情況下，兩個班的結合將具有相同的特異性作爲class +僞類（.list_td:nth-child），但放在它之後，將使.list_td.overlay更重要。

閱讀關於"CSS Specificity"和選擇器權重。

Answer 2

試試這個

.list_td.overlay { 
    background:rgba(240,0,92,0.4); 
    color:#530724; 
} 

工作演示http://jsfiddle.net/qw10hwc6/1/