提交按钮不会在悬停时更改

Question

我正在尝试让捐赠按钮在以下网站http://laceibamfi.org/中悬停时更改。

我正在使用的CSS在悬停时没有响应。我真的不知道该怎么做。

我想要的是：

<input type="submit" value="Donate Now!" name="Submit" id="theButton">

要产生悬停效果，这就是我目前对CSS的看法：

#theButton {
    background: none repeat scroll 0 0 #73752b !important;
    border-radius: 13px;
    border-top: 1px solid #d4d117;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 1);
    color: #000000;
    font-family: Georgia,serif;
    font-size: 24px !important;
    padding: 6px 12px;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
    vertical-align: middle;
}

为我目前拥有的工作JSFiddle：http://jsfiddle.net/bxm2wnyd/1/

Answer 1

您还没有调用：hover选择器。

如果您使用的是CSS，请创建一个新的块

#theButton:hover {
  selector: property
}

如果您使用SASS，可以在id元素

中调用＆amp;：hover

#theButton {
  ...
  ...
  &:hover {
  }
}

Answer 2

您需要拨打按钮上的:hover selector。然后，当按钮悬停时，您将放置您想要的属性：

#theButton {
  /* your properties here */
}