當禁用ng爲自定義按鈕時禁用css懸停效果

Question

我嘗試禁用自定義button並禁用（指針）功能工作正常。

問題是當我們按下hover時，hover仍然有效。因此我需要禁用懸停。

我需要申請ng-disable多個自定義buttons我不能覆蓋每個按鈕的CSS。

jsfiddle.net/q8r4e/1389/

代碼：

<button class="bt1" ng-disabled="true" >BUTTON</button> 
<button class="bt2" ng-disabled="true" >BUTTON</button> 

.bt1{ 
background-color: #e38000; 
    border: 0 none; 
    border-radius: 15px; 
    color: #ffffff; 
    font-size: 14px; 
    height: 30px; 
    width: 135px; 
} 
.bt1:hover{ 
background-color: #ffff00; 
    color: #999; 
} 

.bt2{ 
background-color: #33b3e3; 
    border: 0 none; 
    border-radius: 15px; 
    color: #ffffff; 
    font-size: 14px; 
    height: 30px; 
    width: 135px; 
} 
.bt2:hover{ 
background-color: #a2ddf4; 
    color: #999; 
} 

預先感謝您。

Answer 1

而不是

.bt1:hover{ 
    background-color: #ffff00; 
    color: #999; 
} 
.bt2:hover{ 
    background-color: #a2ddf4; 
    color: #999; 
} 

使用

.bt1:not([disabled]):hover{ 
    background-color: #ffff00; 
    color: #999; 
} 
.bt2:not([disabled]):hover{ 
    background-color: #a2ddf4; 
    color: #999; 
} 

Working fiddle

編輯：

要對所有殘疾人按鈕共同CSS，你可以再補充

button:disabled, button:disabled:hover{ 
    background-color:red; 
} 

並用任何你想要的取代紅色。

Updated Fiddle