:any-link仅匹配含非空href的a/area元素，需Chrome 89+/Firefox 84+/Safari 15.4+支持；color等颜色属性跨状态生效，font-size等受隐私限制被静默丢弃；不可用于JS查询，且:hover须写为:any-link:hover。
a:any-link 不是万能替代，它只在特定条件下简化写法，且不能覆盖 :visited 的隐私限制。
哪些链接会被 :any-link 匹配到
它只匹配实际可跳转的 a 和 area 元素，且必须满足：
-
href属性存在且非空（href=" "或href=""都不算） - 元素已渲染进 DOM（
<link rel="stylesheet">不算，它不参与页面导航） - 浏览器支持：Chrome 89+、Firefox 84+、Safari 15.4+
写成 a:any-link 是常见做法，但更语义准确的是 :any-link（不带标签名），因为规范允许它匹配所有符合条件的链接元素，不限于 a。
:any-link 里哪些 CSS 属性真正跨状态生效
受浏览器 :visited 隐私策略约束，以下属性在已访问链接上会被静默丢弃，哪怕你写了也白写：
立即学习“前端免费学习笔记（深入）”；
-
font-size、padding、margin、height、width -
opacity、transform、visibility、display -
font-weight、line-height、text-shadow
真正能稳定生效的只有颜色类属性：
-
color、background-color -
border-color、outline-color -
text-decoration-color（配合text-decoration: underline才有效）
为什么 document.querySelector(':any-link') 会报错
因为 :any-link 是纯 CSS 伪类，不是标准 DOM 选择器。它不能用于 JS 查询，以下写法全都会抛 SyntaxError：
document.querySelector(':any-link')document.querySelectorAll('a:any-link')el.matches(':any-link')
若需 JS 判断某元素是否为链接，只能退回到手动检查：el.tagName === 'A' && el.href && el.href.trim()。
继承和层叠顺序常被忽略的关键点
很多人写了 a:any-link { color: #007bff; }，却发现某些链接没变色——问题往往出在：
- 父容器用了
all: unset或color: inherit，把:any-link的color继承链吞掉了，必须显式重置（如加color: #007bff !important或在更高层设默认值） -
a:hover权重高于:any-link:hover，如果后者定义在前，前者定义在后，hover 样式就会被覆盖 -
a:any-link:hover是非法写法，浏览器直接忽略整条规则；正确写法是:any-link:hover（不带标签名）或拆成a:hover单独处理
真正难搞的不是写法，而是你写了之后发现部分样式“看起来没生效”——那大概率是隐私限制在后台悄悄拦截，或者继承链把你绕晕了。
