:any-link 仅匹配含非空 href 的 a/area 元素，且需 chrome 89+/firefox 84+/safari 15.4+；失效主因是 href 为空、误选 link 元素或浏览器不支持。
:any-link 能同时匹配已访问和未访问链接，但必须满足两个硬性条件：元素有非空 href 属性，且浏览器支持（Chrome 89+、Firefox 84+、Safari 15.4+）。不写错、不乱套、不强求兼容老浏览器，它就能生效。
为什么 :any-link 不生效？常见失效原因
写了 a:any-link 却没反应，大概率踩了下面几个坑：
-
href值为空或仅为空格（如href=""或href=" "）——浏览器不认为这是有效链接，直接跳过匹配 - 误以为
<link>或<area>也能被选中——实际只匹配解析后「可跳转」的a、area元素，<link>默认不渲染，也不在选择范围内 - 在旧版 Safari（:any-link，需降级为
a:link, a:visited - 用
document.querySelector(':any-link')尝试 JS 获取——会报SyntaxError，因为这不是标准选择器，不能用于 DOM 查询
:any-link 和 :link + :visited 手动组合的区别
表面上 :any-link 等价于 :is(:link, :visited)，但行为差异很实在：
- 样式统一容易，状态分离难：用
a:any-link { color: #007bff; }可一键覆盖所有链接文字色；但若想未访问时蓝色、已访问时紫色，就必须拆成a:link { color: blue; }和a:visited { color: purple; } - 伪类链式无效：
a:any-link:hover是非法写法，浏览器会整个规则丢弃；正确写法是:any-link:hover（不带标签名）或a:hover:any-link（不推荐，语义混乱） - 优先级相同但易被覆盖：
:any-link:hover和a:hover权重一样，如果后者定义在后面，就会把前者样式盖掉——别指望它“自动赢”
隐私限制对 :any-link 的隐性影响
哪怕你写了 :any-link { font-size: 16px; padding: 4px; }，这些样式在已访问链接上根本不会生效。原因不是语法错，而是浏览器强制干预：
- 受
:visited隐私策略约束，:any-link中任何涉及尺寸、布局、可见性的属性（font-size、padding、margin、opacity、transform等）对已访问链接一律静默丢弃 - 真正能跨状态生效的，只有颜色类属性：
color、background-color、border-color、outline-color、text-decoration-color - 这意味着：用
:any-link统一加下划线可以（text-decoration: underline），但统一改字体粗细（font-weight）在已访问链接上会回退到默认值
真正容易被忽略的是：哪怕你用 :where(:any-link) 把优先级降到最低，也绕不开浏览器对已访问链接的样式压制——这不是 CSS 层面能解决的问题，是底层隐私机制硬性拦截。如果项目要精确控制已访问链接的视觉反馈，还是得老老实实分开写 :link 和 :visited，并接受它们的能力边界。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
