CSS 手机端 hover 点击后无法取消样式解决方案

问题：

在 pc 端 hover 样式是鼠标悬浮显示效果，不悬浮就消失；

在移动端，hover 样式点击后显示，此后如果不做处理，那么 hover 样式就一直存在。

原因：

因为手机上的 :hover 效果相当于 click ，没办法检测到鼠标表移出。

解决办法：

可以使用 :active 属性来替代 :hover 解决问题。

拓展：

a:link ：英文 link 就是链接的意思，表示当一段文本为链接时的属性。

a:visited ：英文 visited 就是访问过的意思，表示这段文本被点击之后的属性。

a:hover ：英文 hover 就是悬停的意思，表示鼠标指针放在这个链接上时的属性。

a:active ：英文 active 就是有效的、快速的意思，表示鼠标按下时一瞬间的属性。

a:focus ：英文 active 就是聚焦的意思，表示元素获得焦点时向元素添加特殊的样式。