:visited 必须紧接 :link 后且顺序固定，否则浏览器解析时直接忽略；仅允许设置 color 等极少数属性，其他声明静默丢弃；:hover 和 :active 需按时间先后排列，:active 必须在 :hover 后才能可见。
顺序错一个，:visited 就可能完全不生效
这不是样式覆盖问题，而是浏览器在解析阶段就跳过 :visited 的匹配逻辑。现代浏览器要求 :link 和 :visited 必须紧邻且顺序固定：:link → :visited。中间插一条注释、一个空行，甚至另一个选择器（比如 .btn 规则），某些旧引擎或严格模式下会直接忽略 :visited 声明——连控制台警告都没有。
常见错误包括：
- 把
:hover写在:visited前面，导致已访问链接悬停时颜色回退到默认值 - 用
!important强提:hover权重，结果:active被压制，点击瞬间无反馈 - 只写
:visited不写:link，未访问链接回退到浏览器原生蓝色下划线，视觉断裂
:hover 和 :active 必须按时间先后排，不是按“重要性”
:hover 是鼠标移入的瞬时态，:active 是鼠标按下到松开的更短瞬时态。两者都叠加在 :link 或 :visited 之上，但 :active 必须能“穿透” :hover 才看得见——所以它必须写在 :hover 后面。
如果顺序颠倒：
立即学习“前端免费学习笔记（深入）”；
-
a:hover { color: red; }写在a:active { color: green; }后面 → 点击时闪一下绿色就立刻变红，因为松开鼠标后仍处于 hover 态 - 快速连点时，
:active样式几乎不可见，用户感知不到点击响应
:visited 能设的样式极少，顺序再对也救不了乱写的属性
浏览器出于隐私限制，:visited 只允许设置：color、background-color、border-color、outline-color、text-decoration-color 等极少数属性。其他任何声明都会被静默丢弃：
-
a:visited { background-image: url(logo.png); }→ 完全无效 -
a:visited { font-weight: bold; }→ 不生效，也不报错 -
a:visited { transform: scale(1.1); }→ 被忽略
所以即使顺序完全正确，只要写了不允许的属性，:visited 就等于没写。
移动端和键盘用户要加 :focus，但不能破坏 LVHA 主干
触摸设备不触发 :hover，键盘用户靠 Tab 切换焦点，所以常需补充 :focus。但它不是 LVHA 的一部分，必须作为并列状态插入：
- 正确位置：
a:hover, a:focus→a:active - 错误做法：
:focus插进:link和:visited中间 → 破坏互斥状态链，:visited可能失效 - 错误做法：
:focus放在:active后面 → 回车触发时先看到:active，再跳到:focus，视觉跳变
真正容易被忽略的是：这个顺序不是为了“写得整齐”，而是浏览器内部状态机匹配依赖于此——哪怕你只用其中两个伪类，比如只写 :link 和 :hover，:link 也必须在前；一旦引入 :visited，它就必须紧跟其后，中间不能有任何东西干扰解析流。
