:visited 伪类必须按 lvha 顺序声明，仅支持有限样式属性，https 环境下才可靠，且易被高权重选择器覆盖。
link 和 visited 伪类必须按 LVHA 顺序写
浏览器只认 a:link、a:visited、a:hover、a:active 这个顺序，写反了（比如把 :visited 放在 :link 后面）会导致 :visited 样式被覆盖，访问过的链接颜色根本不会变。
常见错误现象：a:visited 完全不生效，无论怎么刷新、点开再返回都没反应——大概率是顺序错了。
-
a:link只对未访问的链接起作用，已访问的链接它管不了 -
a:visited只能设置有限的 css 属性：颜色类（color、background-color、border-color等）、outline、cursor，不能改font-size或display，否则会被忽略 - 现代浏览器出于隐私限制，
:visited的样式无法通过 JavaScript 获取，也不能用getComputedStyle读取真实值
为什么设置了 color 却没变化？检查是否被其他选择器覆盖
比如写了 a:visited { color: #666; }，但页面里还有 .nav a { color: #333; }，后者权重更高，就会压掉 :visited 的颜色。
使用场景：导航栏、文章内链、页脚链接，只要想区分访问状态，就得确保 :visited 规则足够具体。
立即学习“前端免费学习笔记（深入）”；
- 提高权重的方法：加父级容器，比如
article a:visited或#main-content a:visited - 避免用
!important，它会让后续调试更难，优先靠选择器特异性解决 - chrome DevTools 的 Styles 面板里，被划掉的
color值说明它被别的规则覆盖了
visited 伪类在 https 页面下才可靠
HTTP 页面中，某些浏览器（尤其是新版 Chrome/firefox）会弱化或禁用 :visited 样式，防止通过 CSS 侧信道探测用户历史记录。所以本地 file:// 或 HTTP 环境下测试，很可能看到 :visited 表现异常。
性能 / 兼容性影响：这不是 bug，是主动的安全限制。哪怕你代码完全正确，在非 HTTPS 下也可能失效。
- 开发时务必用
localhost（现代浏览器视其为安全上下文）或部署到 HTTPS 环境验证 - 不要试图绕过这个限制——比如用 js 检查
document.querySelectorAll('a')的visited状态，浏览器根本不提供该接口 - 如果产品必须支持 HTTP 内网环境，得换思路：用后端标记或 localStorage 记录点击，再加 class 控制颜色
想让已访问链接带下划线？别只改 color
很多人以为改了 color 就够了，结果发现访问前后都一样——因为默认 a 有 text-decoration: underline，而 :visited 如果没显式声明，会继承父级或浏览器默认值，容易混淆视觉差异。
参数差异：text-decoration 不在 :visited 的受限属性列表里，可以放心设。
- 推荐写法：
a:link { color: #007bff; text-decoration: underline; }+a:visited { color: #6c757d; text-decoration: underline; } - 如果想强调区别，可给已访问链接去掉下划线：
a:visited { color: #6c757d; text-decoration: none; } - 注意：
text-decoration-color和text-decoration-style在:visited中也支持，但兼容性稍差（IE 不支持），用前查 caniuse
事情说清了就结束。最常卡住的地方不是语法写错，而是顺序不对、HTTPS 缺失、或者被更高权重的选择器静默覆盖——这三处多看两眼 dom 面板和 Styles 面板，基本就定位完了。