a :hover样式设置后，点击后进入新页面，点击原页面窗口，a标签接依然处于hover状态

Question

今天测试提交的一个兼容性问题，谷歌没上没有问题，QQ浏览器上会出现。感觉是浏览器没有将打开新页面算为离开a标签

例如：

<style>

    a:hover{

        background-color: red;

    }

</style>

<a href="https://www.baidu.com/" target="_blank">123123131</a>

在鼠标未移入原页面前，依旧是hover的状态。

相当于是鼠标在这一块移动的时候，依旧被默认为是在hover状态

Answer 1

这个样式可能会被后声明的其他链接相关的伪类覆盖，这些伪类包括 :link，:hover和 :visited。为了正常加上样式，需要把 :active的样式放在所有链接相关的样式后，这种链接伪类先后顺序被称为LVHA顺序: :link — :visited — :hover — :active。:acitve被重写了,给:active修饰一下应该就可以了