正确顺序是LVHA：a:link→a:visited→a:hover→a:active，顺序错会导致:hover被:visited覆盖或不匹配；:visited仅支持有限样式，且动态插入链接需提前注入样式。
因为 :hover 规则被 :visited 覆盖了，或者根本没匹配到目标元素——不是语法错，而是层叠或选择器问题。
伪类顺序写反了（LVHA 错位）
CSS 要求 a:link、a:visited、a:hover、a:active 必须按 LVHA 顺序声明，否则浏览器会按书写顺序覆盖。比如：
a:hover { color: red; }
a:visited { color: purple; }
一旦链接被访问过，a:visited 就会压住 a:hover 的颜色，悬停时还是紫色。
- 正确顺序必须是：
a:link→a:visited→a:hover→a:active - 哪怕只用其中两个，比如只设
:visited和:hover，也得把:visited写在:hover前面 - 旧版 Safari 或某些 WebView 对顺序更敏感，错一位就可能完全不触发 hover
选择器没选中实际元素（空格/类名/状态冲突）
写 a:hover 却没反应，大概率不是 hover 本身坏了，而是规则根本没应用到那个 <a> 元素上。
立即学习“前端免费学习笔记（深入）”；
-
a :hover（带空格）匹配的是<a>内部的某个子元素悬停，不是链接自身——删掉空格才是a:hover - 如果用了
a:visited:hover，这是非法组合：已访问链接无法再满足 hover 条件，整条规则被浏览器跳过 - 类名拼错、元素被
display: none隐藏、或父级有pointer-events: none，都会让 hover 失效
浏览器对 :visited 的隐私限制干扰了 hover 效果
现代浏览器禁止 :visited 修改除 color、background-color 等极少数属性外的样式，目的是防历史嗅探。但这个限制间接影响 hover：
- 如果你在
a:visited里只设了color，却在a:hover里改background-color或transform，那没问题 - 但若
a:visited用了!important强制设了color，而a:hover没显式重写该属性，颜色就不会变 - 某些安卓 WebView 或旧版 Chrome 会把
:visited的限制“传染”到 hover 上，导致部分动画卡住或不触发
最易被忽略的一点：动态插入的链接（比如 JS 渲染的菜单项），其 :hover 规则必须在 DOM 插入前就存在于样式表中；否则即使选择器正确，浏览器也可能因样式未就绪而跳过匹配。调试时用 DevTools 的 “Force element state” 功能手动触发 :hover，能快速区分是逻辑问题还是渲染时机问题。
