如何覆蓋<DT>背景顏色以模擬禁用？

Question

我有以下的CSS設置：

.dropdown dt { background:#e4dfcb !important; } 
.dropdown-disabled { background:#dddddd important; color:#aaaaaa; } 

所以在我的HTML代碼，我故意擺在那裏下拉殘疾類，它應該強制背景顏色的覆蓋......但是情況並非如此。

<dt id="dtTestID" class="dropdown-disabled"> 
    <a href="#"><span>Hello World</span></a> 
</dt> 

我在做什麼錯？唉......

編輯：

好吧，我已經更新的代碼如下：

.dropdown-enabled { background:#e4dfcb; } 
.dropdown-disabled { background:#dddddd; } 

.dropdown dt { background:#e4dfcb !important url(arrow.png) no-repeat scroll right center; } 
.dropdown dt a { display:block; padding-right:20px; border:1px solid #d4ca9a; width:150px;} 
.dropdown dt a:hover { color:#ffffff; border: 1px solid #d0c9af;} 
.dropdown dt a span { color:#816c5b; cursor:pointer; display:block; padding:5px; } 
.dropdown dt a span:hover { color:#ffffff; cursor:pointer; display:block; } 

<dt id="dtTestID" class="dropdown-disabled"><a href="#"><span>Hello World</span></a></dt> 

此作品爲背景，我只是需要把其他地方啓用下拉列表，。但是，現在我遇到了另一個（類似）問題，我無法覆蓋鏈接的樣式。我嘗試了以下...

覆蓋！重要的顏色，並將我的殘疾人設置爲一種新的顏色。

.dropdown dt a span {color：＃816c5b！important;光標：指針;顯示：塊;填充：5像素; } .dropdown-disabled {background：#dddddd;顏色：#AAAAAA; }

任何想法？

Answer 1

發現周圍的工作...... 我不得不從我的DT刪除鏈接，然後更新我的CSS如下：

.dropdown-enabled { background:#e4dfcb; } 
.dropdown-disabled span { background:#dddddd; color:#aaaaaa; } 

之後，我需要使用jQuery監視其他鼠標點擊元素手動切換到啓用...並重新插入鏈接。

var dt = jQ(this).find("dt"); 
// put back the look of enabled the element 
dt.removeClass("dropdown-disabled"); 
dt.addClass("dropdown-enabled"); 

// put back the link in there to trigger the dropdown 
var newhtml = jQ('<a href="#"></a>').append(dt.html()); 
dt.html(newhtml); 

Answer 2

CSS中沒有important修飾符，只是!important。 試試這個：

.dropdown dt { background:#e4dfcb } 
.dropdown-disabled { background:#dddddd !important; color:#aaaaaa; } 

希望它有幫助。