:any-link:hover非法，浏览器直接忽略整条规则；正确写法是:any-link:hover（不带标签名）或拆分为a:hover、area:hover；颜色类属性跨状态生效，font-size等受隐私限制被静默丢弃。
:any-link 能统一设置基础样式，但无法真正统一交互样式——hover、active 等状态必须单独处理，且已访问链接受隐私限制，很多属性会被浏览器静默丢弃。
为什么 :any-link:hover 写了没反应
浏览器直接忽略整条规则，因为 :any-link:hover 是非法链式伪类。CSS 规范不允许在 :any-link 后叠加其他动态伪类（如 :hover、:active）。
- ✅ 正确写法是：
:any-link:hover（不带标签名），或拆成独立规则：a:hover、area:hover - ⚠️
a:any-link:hover和a:hover:any-link全部无效，解析失败后整条 CSS 规则被丢弃 - ⚠️ 即使写了
:any-link:hover，已访问链接上font-size、transform、padding依然不会生效——这是浏览器强制隐私保护，不是你写错了
:any-link 哪些样式能跨状态真正生效
只对颜色类属性稳定起作用；其余属性在已访问链接上会被浏览器悄悄回退到默认值，连 !important 都拦不住。
- ✅ 安全可用：
color、background-color、border-color、outline-color、text-decoration（如underline）、text-decoration-color - ❌ 白写无效：
font-size、padding、margin、opacity、transform、line-height、font-weight - ? 小技巧：想让 hover 时加下划线？用
:any-link:hover { text-decoration: underline; }可行；但想 hover 时放大文字？得放弃:any-link，改用a:hover单独控制
为什么 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() - ⚠️ 注意：
href是空字符串（""）或纯空格（" "）时，该元素不匹配:any-link，JS 检查也应同步排除
兼容性与继承链里最易翻车的点
写了却“看起来没变色”，大概率不是语法问题，而是掉进了这几个坑：
- ? 浏览器版本太低：Chrome a:link, a:visited
- ? 父级用了
all: unset或color: inherit，把:any-link的color吞掉了，得显式重置（比如加color: #0d6efd !important） - ? 错把
<link>当作可样式化链接——:any-link只匹配解析后「可跳转」的<a></a>和<area>，<link>不参与渲染也不匹配 - ⚠️ 权重陷阱：
a:hover和:any-link:hover优先级相同，但如果a:hover定义在后面，就会覆盖前者——别指望靠顺序“自动叠加”
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
