当我将鼠标悬停在访问的链接上时， colored颜色 会正确变化，但背景 colored颜色 不会.我注意到这可以通过为a设置背景 colored颜色 来修复，但为什么会这样？
a {
text-decoration: none;
color: inherit;
}
.link-1:visited,
.link-2:visited {
color: violet;
}
.link-2 {
background-color: yellow;
}
.link-1:visited:hover {
color: cyan;
background-color: orange;
}
.link-2:visited:hover {
color: cyan;
background-color: orange;
}<a href="https://stackoverflow.com" class="link-1">Link 1, without inital bg</a>
<br/>
<a href="https://stackoverflow.com" class="link-2">Link 2, with initial bg</a>