Удалить изменение цвета после нажатия на кнопку начальной загрузки

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

Вы можете использовать :active псевдокласс на кнопке:

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

Answer 2

Вы можете добавить другой класс для переопределения поведения 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>