CSS - 在悬停时更改按钮背景颜色

Question

我需要在悬停时更改按钮背景颜色。

我在jsfiddle上的CSS： CSS

我的HTML：

<input type='button' class='btn btn-default btn-success btn-lg' value='test'/>

DEMO

Answer 1

您可以通过以下方式实现它。如果您在CSS的底部添加此类，则此解决方案将起作用。

.btn:hover
{
background-image:none;
background-color:#ff00ff;
}

如果您将此类放在其他样式之上，则需要使用important关键字来克服其他样式，如下所示。

.btn:hover
{
background-image:none !important;
background-color:#ff00ff !important;
}

DEMO

Answer 2

您可能会使用此解决方案!important使CSS无效。在这种情况下，具有type= button类的所有.btn只会受到影响。

input[type="button"].btn:hover{background:red;}

Answer 3

您可以使用以下

来实现

.btn:hover{
//apply styles here
}

Answer 4

这很简单，你只需要添加css选择器：hover

例如：

.btn-success:hover{
    color: #ffffff;
   background-color: #51a351;
}

Answer 5

您可以使用：将鼠标悬停在类的鼠标悬停事件中。如果你想要，可以使用：

btn:hover {
   color:blue; 
}

祝你好运