我有以下按钮。
上面按钮的 CSS 是这样的：
.cta-btn {
display: inline-block;
margin: 20px 0 0 20px;
color: #fff;
background-color: #FF8F1B;
background-image: linear-gradient(to right, #2ab3ff, #ff2d00);
box-shadow: 4px 5px 27px 4px rgba(220, 120, 184, 0.85);
font-size: 21px;
border-radius: 30px;
padding: 12px 21px;
font-family: Montserrat;
}<a href="#" class="cta-btn">click me</a>当我将鼠标悬停在按钮上时，我希望按钮能够平滑地更改渐变颜色。当我悬停按钮时，我不希望渐变颜色只是捕捉到按钮上。这是我尝试平滑渐变颜色过渡：
a.cta-btn:hover {
background-image: linear-gradient(to right,#FF2A67,#FF5D3A);
color: #fff;
box-shadow: 4px 5px 27px 4px rgba(255,45,45,0.85);
transition: background-image .3s linear;
transition: box-shadow .3s linear;
}
任何帮助深表感谢。
css ×1