必须按LVHA顺序声明a标签伪类：:link→:visited→:hover→:active；:visited仅支持color、background-color等有限样式，且不可被JS读取或通过!important绕过安全限制。
link 和 visited 伪类的声明顺序不能乱
浏览器对 a:link 和 a:visited 的匹配有严格顺序：必须先写 :link，再写 :visited，否则 :visited 可能被忽略。这是因为 CSS 优先级规则中，后声明的样式会覆盖同权重的前声明——但 :visited 本身受安全限制，只能设置有限样式（颜色、背景色、边框色等），且一旦顺序错，连这些都被压制。
- 正确顺序：
a:link { color: blue; }→a:visited { color: purple; } - 错误写法：
a:visited写在:link前面，多数浏览器直接不生效 - 别用
!important强行覆盖，它无法绕过安全策略，反而让调试更难
visited 样式能改的属性非常有限
出于隐私保护，现代浏览器禁止通过 :visited 读取或影响布局相关属性。你只能安全地设置：color、background-color、border-color（及各方向变体）、outline-color，还有少数几个 text- 开头的属性（如 text-decoration-color）。其他一概无效，比如 display、font-size、padding、visibility 都会被静默忽略。
- 常见踩坑：
a:visited { font-weight: bold; }—— 完全没反应，控制台也不报错 - 想靠
:visited改图标？不行。用background-image也不行（已被禁用） - 颜色值支持所有合法格式：
#663399、rgb(102,51,153)、rebeccapurple都可以
hover 和 active 必须放在 link/visited 之后
要让鼠标悬停和点击时的颜色正常切换，:hover 和 :active 必须排在 :link 和 :visited 后面，否则它们可能被覆盖。完整推荐顺序是：:link → :visited → :hover → :active（LVHA 规则）。
- 典型问题：
a:hover写在a:link前面，结果悬停时颜色不变 -
:active是点击瞬间的状态，不是“已点击”，所以它不影响访问历史判断 - 如果用了
:focus（例如键盘导航），建议放在:active后面，形成 LVHFA
visited 状态不会实时更新，缓存和隐私策略会影响表现
页面加载后，:visited 状态由浏览器根据本地历史记录决定，不会因 JS 修改 location 或点击跳转而立刻刷新当前页的链接样式。而且，隐私模式下、或启用了“阻止网站跟踪”选项时，:visited 可能完全不触发，或者只对同源链接生效。
立即学习“前端免费学习笔记（深入）”；
- 测试时别只看一个标签页：新开无痕窗口，手动访问目标链接后再回来，才能看到效果
- 用
document.querySelector('a').visited？不存在这个属性，JS 无法读取:visited状态（这是刻意设计的安全限制） - 某些浏览器（如 Firefox）对跨域链接的
:visited更保守，甚至默认禁用
