直接修改a标签color属性即可改变链接颜色，但需同时设置a:link和a:visited以覆盖未访问与已访问状态，再补充a:hover和a:active，并注意深色模式适配与可访问性对比度要求。

直接改 a 标签的 color 属性就行

浏览器默认给 a 标签加了蓝色文字和下划线，这不是“固定死”的，而是 CSS 默认样式在起作用。只要写一条规则覆盖它，颜色立刻变——但得注意：a 有四种状态（未访问、已访问、悬停、激活），只改 color 不一定全生效。

a:link 和 a:visited 必须一起设，否则已访问链接不生效

这是最容易踩的坑：很多人只写 a { color: red; }，结果点过的链接还是紫色。因为浏览器对 a:visited 有独立样式优先级，且出于隐私限制，它只允许设置有限的属性（color、background-color 等几个）。所以必须显式声明：

/* 这样才管用 */
a:link { color: #2563eb; }
a:visited { color: #4f46e5; }
a:hover { color: #1d4ed8; }
a:active { color: #1e40af; }

• a:link 控制未访问链接，a:visited 控制已访问链接，缺一不可
• 不能只写 a 或 a:active 就想覆盖全部状态
• 如果用了 CSS 预处理器或框架（比如 Tailwind），要确认它们有没有插入自己的 :visited 规则

内联样式 vs 外部 CSS：顺序和权重决定谁赢

如果你在 HTML 里写了 <a href="#" style="color: orange;">链接</a>，那它会盖过外部 CSS 里的 a:link，但盖不过 a:visited——因为内联样式的优先级虽高，但 :visited 是伪类，浏览器强制它按自身逻辑走。

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

• 想全局统一改色，优先用外部 CSS 写全四个状态
• 临时单个链接换色，用内联 style 可以，但别指望它影响已访问后的颜色
• 如果用了 !important，它对 :visited 也无效（浏览器故意禁掉）

深色模式下颜色对比度不够，用户根本看不见

很多人改完颜色就以为完了，结果在深色系统里，浅蓝文字配深灰背景，对比度低于 4.5:1，文字发虚甚至隐形。这不是 bug，是可访问性硬要求。

立即学习“前端免费学习笔记（深入）”；

• 用浏览器 DevTools 的“Contrast ratio”检查工具测一下
• 别用纯黑 #000 或纯白 #fff 做链接色，尤其在深/浅背景切换时
• 推荐用 prefers-color-scheme 媒体查询适配：

  @media (prefers-color-scheme: dark) {
    a:link, a:visited { color: #60a5fa; }
  }

真正麻烦的是：颜色不是改一次就结束的事，它得跟着状态、主题、可访问性一起动。漏掉任何一个，用户就在某个场景下卡住。