如果按鈕沒有被禁用，懸停效果？

Question

我有以下的CSS規則：

button.medium.fade-btn:hover:not([disabled]) { 
    color:red; 
} 

和HTML代碼：

<button class="medium fade-btn" disabled></button> 

我需要懸停效果只能在未禁用按鈕。

Answer 1

您還沒有構建你的選擇正確

button.medium.fade-btn:hover:not([disabled]) 

在理論上沒有任何選擇，但搜索按鈕，因爲你把它懸停後的孩子（這是沒有的）。

button.medium.fade-btn:not([disabled]):hover 

是正確的方法。

懸停是事件，所以你希望發生在未禁用的按鈕，所以它在一切之後。選擇元素，然後使用懸停作爲最後一部分。使用禁用可能更容易：true/false。

編輯：這是一個瀏覽器兼容性問題，或者您的瀏覽器不喜歡在類型選擇器中使用禁用。你應該嘗試在你的選擇器中使用disabled = true，並檢查你的瀏覽器版本是否支持：not（）被支持。