单击引导程序按钮后删除颜色更改

Question

<button type="button" style="line-height: 0.4em;text-align: left;height:35px" class=" btn btn-success  btn-block">></button> 

单击后，按钮的颜色会稍微变深，表明已被单击，并且在页面正文中单击鼠标时，该按钮将恢复为正常颜色。我想抑制这种效果。我也尝试过box-shadow:none和shadow-none，但是没有用。 我该如何实现？

Answer 1

您可以添加另一个类来覆盖hover行为：

.btn-success-reset{
  width: 200px;
  line-height: 0.4em;
  text-align: left;
  height: 35px;
}

.btn-success.btn-success-reset:hover {
  background-color: #28a745;
  border-color: #28a745;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" />
<button type="button" class="btn btn-success btn-block btn-success-reset">></button>

Answer 2

您可以在按钮上使用:active伪类：

.button_class_name:active {
 background-color: red;
}