问题是过渡不适用于背景颜色

Question

- 代码如下-

我已设置为按钮 问题在于：过渡：全0.5s； 当背景颜色与按钮颜色同时更改时，它适用于按钮。 （当我这样做时：悬停） 但是当我按下按钮时它停止工作。背景颜色不适用：过渡：全0.5s； 但文字的颜色继续与他合作。 我不明白问题出在哪里，只有在我按下按钮时才发生。 然后我给了他这个代码：

#pricing .allplan .plan .btn a:link{
background-color: #eaeafd;
padding: 15px 32px;
border-radius: 40px;
color: #4033ff;
transition: all 0.5s;
}
#pricing .allplan .plan .btn a:visited{color: #4033ff;}
#pricing .allplan .plan .btn a:hover{
background-color:#4033ff;
color: #ffffff;
}

Answer 1

我看到两个问题，当您单击按钮时，它不是已访问状态，而是调用的活动状态（a：active）。第二个错误是你的属性的顺序，如果你想覆盖一个css属性，活动应该在悬停之后，因为级联。

.btn a{
  background-color: #eaeafd;
  padding: 15px 32px;
  border-radius: 40px;
  color: #4033ff;
  transition: all 0.5s;
}

.btn a:hover{
  background-color:#4033ff;
  color: #ffffff;
}
.btn a:active{
  color: #4033ff;
}

<div class="btn">
  <a href="#">link</a>
<div>