a:any-link 常无效是因为只匹配含非空 href 的 a 标签，不匹配 href=""、null/undefined 或解析失败的值；旧浏览器会因不认识 :any-link 而丢弃整条规则；它仅允许 color 等有限样式，禁用 padding、font-size 等；且不覆盖 button 或 role="link" 元素。
为什么直接写 a:any-link 常常没效果？
不是语法错，而是浏览器根本没匹配到元素——a:any-link 只匹配带非空 href 属性的 a 标签，不匹配 href=""、href="javascript:void(0)"（注意：这个值其实算非空，但部分旧 Chromium 版本会解析失败）、或 href 是 null/undefined 导致 DOM 中压根没渲染该属性的情况。
- Vue/React 模板中写
v-bind:href="url"，当url为""或null时，href属性不会出现在最终 HTML 里 →:any-link不触发 -
href=" # "（带空格）能匹配:any-link，但可能被:link忽略，因为 URL 解析失败 - 务必用浏览器开发者工具检查真实 DOM：右键「检查元素」→ 看
a标签上是否真有href="..."且值非空字符串
a:any-link 和 a:link, a:visited 能混着写吗？
不能直接并列写成 a:any-link, a:link, a:visited —— 这样在 Safari 15.3 及更早版本会导致整条规则被忽略（选择器解析失败）。旧浏览器不认识 :any-link，遇到未知伪类就丢弃整个选择器。
- 正确做法是分层：先写兼容性好的兜底规则，再用
:any-link覆盖（新浏览器会优先匹配它） - 示例顺序：
a:link, a:visited { color: #0d6efd; text-decoration: none; }<br>a:any-link { color: #0d6efd; text-decoration: underline; } - 不要写
a:any-link, a[href]：虽然a[href]是 fallback，但组合选择器会让旧浏览器直接跳过整行
:any-link 能改 padding 或 font-size 吗？
不能。因为 :any-link 内部包含 :visited 状态，而浏览器对 :visited 的样式限制会“传染”到整个选择器——所有被 :visited 禁用的属性，在 :any-link 里同样无效。
- 允许的属性只有：
color、background-color、border-color、outline-color、text-decoration-color（仅部分浏览器） - 禁用的属性包括：
padding、margin、font-size、opacity、transform、text-decoration-style等 - 如果写了
a:any-link { padding: 4px; }，Chrome/Firefox 会静默忽略这一条，但其他属性仍生效
真正要统一“所有可点击链接”，:any-link 还不够
:any-link 只管带 href 的 a，但现代页面里大量“链接感”元素其实没有 href：比如 button、带 onclick 的 div、或用 role="link" 的元素。它们需要靠别的手段归一化。
- 若需视觉统一，建议额外加一层类名，例如
.link-like，然后写.link-like, a:any-link - 避免依赖
:any-link做交互逻辑判断（如 JS 里查matches(':any-link')），它不反映“是否可点击”，只反映“是否有 href 属性” - 最易被忽略的一点：它不解决
:hover和:active的统一问题——这两个状态仍需单独写，且必须放在:any-link之后才不会被覆盖
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
