滑鼠移動到button顏色改變的實現

我使用的是jsp，html方法一致

要實現button需要用到onmouseover與onmouseout方法
示例：

<input type="button" value="喜歡" οnmοuseοver="this.style.backgroundColor='#5f5f5f';"οnmοuseοut="this.style.backgroundColor='#cacaca';" class="check2">

滑鼠未移入效果：
滑鼠移入後效果：
當然，如果直接使用上面的程式碼，你能得到的效果其實是這樣的：
button的預設顯示樣式

重新來看一下程式碼：

<input type="button" value="喜歡" οnmοuseοver="this.style.backgroundColor='#5f5f5f';"οnmοuseοut="this.style.backgroundColor='#cacaca';" class="check2">

οnmοuseοver="this.style.backgroundColor=即為滑鼠移入時的顏色
οnmοuseοut="this.style.backgroundColor=即為滑鼠未移入時的顏色

在等號後面加入顏色相對應的十六進位制值即可讓button獲得相對應的顏色顯示。

至於button的樣式，在class後面使用了自定義的css類選擇器

.check2{
    width: 25%;/*寬度可以使用百分號也可以使用數值再以px等結尾*/
    height: 50px;/*高度寬度同理*/
    border: none;/*邊框*/
/*  background-color:#cacaca ;   */
    color: white;/*字型顯示顏色*/
    font-size: 19px;/*字型顯示大小*/
    font-family: Arial,Verdana,Sans-serif;/*字型樣式*/
    margin-left:9px;/*與左邊部件的距離*/
}

這裡是我的方案，按照自己的需要修改相應的值即可，若還有其他需要的功能，那就，那就，查相應文件吧。

此外，類選擇器中的background-color: 可能優先順序低於οnmοuseοut="this.style.backgroundColor（又或者會有衝突？具體未細瞭解） 起初想著在類選擇器中預設顯示按鍵顏色，在配合onmouseover使用，結果發現不可行。（一開始background-color顏色顯示，滑鼠移入後顏色改變，但由於缺少onmouseout，滑鼠移入後顏色將一直保持onmouseover中設定的顏色）

但可以肯定的是onmouseout和onmouseover如果不搭配使用，那麼執行完其中一個功能後，按鍵的顏色將定住不再改變