使用CSS ID

設置上懸停背景顏色按鈕

你好，我想使用它的ID來改變我的我的網頁上按鈕的懸停背景顏色，我已經使用id使用CSS ID

#optinforms-form5-button:hover{ 
    background-color: white; 
    color: black; /* SET COLOR IN BLACK */ 
}

我也嘗試嘗試這

input[type="submit"]:hover { 
    background-color: white; 
    color: black; 
}

，但似乎沒有任何工作，這是按鈕的屏幕截圖和鏈接頁面，這個按鈕是

在本頁面`http://theclosingcode.com/home/

請別人help`

來源

2016-12-28 Tee Famakin

檢查選擇器是正確的，也嘗試添加！重要 –

#optinforms-form5-button:hover { 
    background: white!important; 
    color: black!important; 
}

來源

2016-12-28 15:40:40

dosent工作，謝謝你的迴應 –

奇怪，在我的開發者控制檯工作 –

好吧安裝一個自定義css插件使用den –

爲背景的CSS是內聯，這樣一個簡單的選擇將無法正常工作。你必須刪除內聯的CSS並放入你的CSS文件或在背景顏色後使用！important。

來源

2016-12-28 15:40:21 Axnyff

您提到的元素具有內聯樣式，比您編寫的任何CSS都具有更高的特性。我不會增加重要性，因爲這是不可維護的和不好的做法。

我的建議是從元素中刪除內聯樣式，並將其作爲一個整體從CSS中傳遞。這樣你可以有1個參考點並調試你的代碼。

如果這是不可能的，不幸的是important!似乎是唯一的出路。

來源

2016-12-28 15:45:20

使用：hover選擇器可以在將鼠標移到上面時更改按鈕的樣式。

提示：使用過渡時間屬性來確定的「懸停」效果的速度：

例

.button { 
-webkit-transition-duration: 0.4s; /* Safari */ 
transition-duration: 0.4s;} 

.button:hover { 
background-color: #4CAF50; /* Green */ 
color: white;}

來源

2016-12-28 16:23:33

在一個separeted CSS文件的寫：

#optinforms-form5-button{ background-color: #current_color; color: #current_color; }
#optinforms-form5-button:hover{ background-color: white; color: black; /* SET COLOR IN BLACK */ }

重要提示：建議在這裏，它不會工作，直到你在HTML文件中去除這裏的內嵌樣式：

<input type="submit" name="submit" id="optinforms-form5-button" value="GET YOUR FREE TRAINING" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#49d0d6">

我強烈建議你separete CSS和HTML

來源

2016-12-28 19:06:05

回答

相關問題