html - CSS 样式优先级

Question

有以下HTML:

<li class="tabs__item tabs__item_with_new_orders">123</li>

我想做以下几件事:

1. 设置“tabs_item”CSS 属性
2. 从“tabs__item_with_new_orders”CSS 类设置背景属性

Firebug 向我显示此类已成功应用:

.tabs__item:nth-child(4n+2) {
    background: none repeat scroll 0 0 #89c4bb;
}

我的类(class)在Firebug中穿越了!并且不应用来自“tabs__item_with_new_orders”的背景属性。我该如何解决？我可以使用“!important”属性来设置优先级，但我不想这样做。

Answer 1

使用

.tabs__item:nth-child(4n+2) {
    background: none repeat scroll 0 0 #89c4bb;
}

.tabs__item.tabs__item_with_new_orders {
    background: #000;
}

这样背景应该是黑色的，因为它被覆盖了。