覆蓋來自第三方庫的css值

Question

我正在使用第三方css庫進行造型，但我想爲特定的div指定不同的min-height。
的div使用themeRow類都有一些屬性和套：

min-height: 200px 

在我而言，這是太大了，我想設置一個不同的值，即

min-height: 75px 

所以我定義了一些內嵌css但是呈現在我的價值被排除和div在min-height: 200px

任何娃仍然吸引我可以告訴css使用我的價值而不是第三方價值？

<style> 
.bannerHeight { 
    min-height: 75px; 
} 
</style> 


<div class="themeRow bannerHeight"></div> 

Answer 1

您可以使用!important覆蓋正在由第三方庫分配給您的<div>的min-height: 200px值。嘗試使用此CSS：

<style> 
.bannerHeight { 
    min-height: 75px !important; 
} 
</style> 

Answer 2

恕我直言，最好使用比!important更深的水平。如果這是你的頁面上「主」然後

<style> 
.main .bannerHeight { 
    min-height: 75px; 
} 
</style> 

將覆蓋

<style> 
.bannerHeight { 
    min-height: 75px; 
} 
</style> 

簡單地與任何元素的雙親在這種情況下，更換.main到.bannerHeight，可能只是div .bannerHeight你暗示。 !important應該用於動態創建html css元素的尷尬情況，而不是像這種情況下的簡單CSS覆蓋。

但它的你的電話。

Answer 3

有一種內在的層次結構（因此「級聯」）的樣式表中，可以幫助你解決這個問題（更多在這裏：http://www.w3.org/TR/CSS2/cascade.html這裏：http://www.w3.org/TR/css-cascade-3/）

本質上講，如果你想「覆蓋」的規則，您可以：

• 地方所需的規則下在現有的樣式表（作者張）
• 創建一個新的樣式表，並把它下在頁面上（第二作者張）
• 使用的重要標籤（如上所述）（覆蓋其它呼叫）
• 使用內嵌樣式（不完全推薦，因爲它結合了「形」與「功能」，這些應該是獨立的實體）