關於css類的優先級

我有一個跨度有2個類，如<span class="tag invalid_tag">abc</span>。我正確地通過jQuery添加第二個類，並且我需要第二個類的屬性重寫第一個類，而不實際移除它。例如，屬性是字體顏色和背景顏色。通常標籤是綠色的，但是當我添加類「invalid_tag」時，它應該變成紅色，但不是因爲第一個類具有優先級。我想知道如何改變這個優先級，或者如果我能以不同的方式實現這一點。關於css類的優先級

來源

2011-10-23 Chobeat

CSS聲明的優先級依賴於它們在CSS中的順序（稍後聲明覆蓋較早的聲明）及其特定性（更具體的聲明覆蓋較不特定的聲明）。（它與您在屬性中指定類名稱的順序無關。）更多文章Section 6規範。

下面是訂單示例。這個CSS

.foo { 
    color: red; 
} 
.bar { 
    color: blue; 
}

與此HTML

<p class="foo bar">Hi there</p> 
<p class="bar foo">Hi again</p>

...結果在兩個藍色的段落，因爲第二個聲明優先於第一。（Live example）發生這種情況是因爲兩個聲明都具有相同的特徵。

這裏有特異性的演示：

這個CSS

p.foo { 
    color: red; 
} 
.bar { 
    color: blue; 
}

...有兩個紅色段相同的HTML結果，因爲選擇p.foo比選擇.bar更具體的，所以即使它早於CSS，它也會優先。（Live example）

來源

2011-10-23 12:57:23

+1不知道.... http://jsfiddle.net/PmPhf/ – Rafay

此外，你可以通過一個更具體的規則來達到這個效果吧。 http://jsfiddle.net/PmPhf/1/這種方式的規則可以在任何地方，仍然會覆蓋。看看這個精彩的http://www.stuffandnonsense.co.uk/archives/images/specificitywars-05v2.jpg –

@Erik：我提到了特異性，我不確定你在做什麼...... ......？ –

關於css類的優先級

回答

相關問題