必须按lvha顺序显式设置a、a:link、a:visited、a:hover、a:active的颜色，否则状态样式会互相覆盖；同时需注意优先级冲突、深色模式对比度及:visited的隐私限制。
怎么用 CSS 改 <a></a> 标签的文字颜色
直接写 a { color: #333; } 不一定生效，因为浏览器有默认样式，而且 <a></a> 有多个伪类状态（未访问、已访问、悬停、激活），它们会互相覆盖。
常见错误是只改了 a，结果鼠标移上去变蓝、点完变紫——那是 :visited 和 :hover 在起作用。
- 必须显式设置所有需要控制的状态：
a、a:link、a:visited、a:hover、a:active - 顺序不能乱：按
link → visited → hover → active（LVHA）写，否则:hover可能被:visited覆盖 - 如果只要统一颜色，最简写法是：
a, a:link, a:visited, a:hover, a:active { color: #007bff; }
color 属性不生效的典型原因
写了 a { color: red; } 却没变色？大概率是 CSS 优先级或继承问题。
常见场景包括：父元素设了 color，而 <a></a> 没重置；或者用了 CSS 框架（如 Bootstrap）自带的链接样式，把你的规则压下去了。
立即学习“前端免费学习笔记（深入）”；
- 检查开发者工具里被划掉的
color声明，看哪条规则赢了 - 尝试加
!important快速验证是否是优先级问题（仅调试用，别留在线上） - 注意：
<a></a>默认是display: inline，不会继承父级的color，但某些框架会改它为inline-block或加 wrapper，导致行为异常
内联样式和 <style></style> 哪个更优先
内联样式（style="color: red;"）优先级高于外部或内部 <style></style> 中的规则，这是 CSS 层叠规则决定的。
但实际开发中，硬编码颜色到 HTML 里几乎总是错的：维护困难、无法响应、主题切换失效。
- 除非是 CMS 输出的富文本内容，且你完全无法控制输出逻辑，才考虑用内联样式兜底
- 更稳妥的做法是在 CSS 里用足够高的选择器权重，比如
.content a或body .post a - 避免用
id选择器强行提权，它会让后续覆盖变得更麻烦
深色模式下链接颜色怎么适配
现在用户可能开着系统深色模式，而你的 #000 黑色链接在黑色背景上直接消失。
单纯靠 @media (prefers-color-scheme: dark) 切换颜色还不够——得确保对比度达标（WCAG AA 要求至少 4.5:1）。
- 别只改
color，顺手检查text-decoration-color（下划线颜色）是否也同步变了 - 已访问链接（
:visited）在深色模式下容易被忽略，建议统一用带透明度的蓝色系，比如color: hsl(210 100% 50% / 0.9); - 如果项目用了 CSS 变量，推荐定义
--link-color和--link-visited-color，在媒体查询里批量更新
:visited 的限制（出于隐私保护，它能设置的样式非常少）和深色模式下对比度翻车，最容易被漏掉。 
