css的問題 - 主題按鈕

Question

我做了一個小小的按鈕部件，這是與一些gfx風格。 我該按鈕的CSS類是這樣的：

div.tButton 
{ 
    height:20px; 
    cursor:pointer; 
    background-repeat:no-repeat; 
    background-image:url(/button/button.png); 
} 
... 

說的.css也有類懸停，單擊和殘疾人按鈕狀態。

我想要做的是創建不同的按鈕主題（顏色，大小..）其中使用一個通用的.css文件，只是補充高度和背景圖像 - 所以我不必創建一個完整的CSS文件每個主題。

這怎麼辦？

例如。對於HTML標記我已經嘗試過類似

<div class=tButton btn40>mybutton</div> 

其中btn40是對子級一類的CSS不同高度+背景圖片，但不工作。

任何想法，如果這是可能的？

感謝

Answer 1

基本上!important的樣式屬性將迫使這個類的風格結束屬性來覆蓋所有其他人。這將允許您定義以下爲默認：

<div class="tButton">mybutton</div> 

，將允許你這樣定義

<div class="tButton btn40">mybutton</div> 
<div class="tButton btn30">mybutton</div> 

定製這裏是你如何設置的樣式。

div.tButton 
{ 
    height:20px; 
    cursor:pointer; 
    background-repeat:no-repeat; 
    background-image:url(/button/button.png); 
} 

.btn40 
{ 
    height:30px !important; 
    background-image:url('/button/btn40.png') !important 
} 


.btn30 
{ 
    height:50px !important; 
    background-image:url('/button/btn30.png') !important; 
}