如何排除CSS格式？

Question

可能重複：
How do I prevent CSS inheritance?
is there a way to exclude a tag from css class

我有這樣

.div1 img { 
    // ... 
} 

.myimg { 
    // ... 
} 

和我的HTML代碼，CSS是這樣的，

<div class="div1"> 
    ... 
    <img src="..." class="myimg">  // image html 
    ... 
</div> 

明確將.div1 img中定義的css格式應用於圖像html代碼。但是，我實際上不希望它發生。我可以做些什麼以避免在圖像html代碼中產生'.div1 img'效果？我不想修改div1 img或相關的html代碼的內容，因爲它已經在其他地方使用過（並且它是我不想混淆的模板代碼）。

P.S.我無法刪除或修改<div class="div1">，因爲有其他模板代碼。

謝謝。

Answer 1

你有兩個選擇：

1. 什麼，他們應該可以明確地覆蓋所有在.div1 img定義的造型在.myimg
2. 你可以寫.div1 img:not(.myimg)爲第一條規則。

Answer 2

你可以這樣做：

.div1 img:not(.myimg) { 
    // ... 
} 

：不選擇解釋here

Answer 3

你需要中和所有你給「.div1 img」的那些樣式，例如如果你說「width：100px」，那麼你需要在另一箇中說「width：auto」。

雖然如果第一組中有很多規則，那麼這種方式會非常髒，而且您需要更改佈局。

Answer 4

有一個不錯的小not selector會工作，但不幸的是，它不適用於所有的瀏覽器。

一個可行的方法是重新定義您的子類.mying類中的所有.div1樣式，以覆蓋父類。

這裏是的jsfiddle一個小演示：http://jsfiddle.net/u6MnN/1/

勾搭一下，看看什麼是最適合你的。

Answer 5

如果你在帶有.div1類的容器div中有img標籤，他們當然會得到你在.div1 img中定義的樣式，但是如果你想讓那個div中的8個圖像中有2個圖像具有另一個樣式相信是你爲什麼製作類.myimg），你需要把！在.myimg定義的花式像這樣以後重要：

.div1 img 
{ 
    height: 125px; 
    width: 125px; 
} 
.myimg 
{ 
    height: 150px !important; 
    width: 150px !important; 
} 

這僅僅是如果你不使用CSS 3.0