如何覆蓋CSS的寬度？

Question

如何覆蓋UL的默認寬度？例如：

.tabPage .tabs ul { 
    margin: 0; 
    padding: 0; 
    width:149px !important; 
    margin-top: 10px; 
    list-style: none; 
} 

所以HTML應該是這樣的：

<div class="tabPage"> 
     <div class="tabs"> 
     <ul> <li> ... </li> <ul> 
     </div> 
</div> 

現在我想改變寬度大小50像素爲UL不同的網頁。

我已經試過這樣：

.TabWidthSmall { width:149px; } 

我在<ul>把這個選擇並沒有奏效。

Answer 1

嘗試：

.tabPage .tabs ul.TabWidthSmall { 
    width:50px !important; /* put new width here */ 
} 

Answer 2

爲什麼你需要的!important？ CSS中的規則級聯關閉，使用!important暫停此過程。如果你在父母上設置了一個寬度ul，並在後續的任何子女上設置了另一個寬度ul - 假設css選擇器是正確的 - 這會被拾取並應用到你的元素。

此外，作爲@Javad_Amiry提到你也可以使用!important上你的孩子ul覆蓋以前!important，但我會盡量避開使用這麼多!important的，因爲它是設計不良的標誌。