a标点击后hover事件失效的问题

改变a标签css属性的排列顺序

只需要记住LoVe HAte原则就可以了(爱恨原则)：

link → visited → hover → active

比如下面错误的代码顺序：

a:hover{
  color: green;
  text-decoration: none;
}
a:visited{ /* visited在hover后面，这样的话hover事件就失效了 */
  color: red;
  text-decoration: none;
}

正确的做法是将两个事件的位置调整一下。

注意⚠️各个阶段的含义：

• a:link：未访问时的样式，一般省略成a
• a:visited：已经访问后的样式
• a:hover：鼠标移上去时的样式
• a:active：鼠标按下时的样式