color是唯一合法的超链接文字颜色属性，必须按lvha顺序显式设置a:link、a:visited、a:hover、a:active，否则状态样式会互相覆盖；同时需注意优先级冲突、深色模式对比度及:visited的隐私限制。
color 属性是唯一能改超链接文字颜色的 CSS 属性
直接写 color 就行，没有其他替代属性。它作用于 a 元素的文字部分，不改变下划线、背景或边框。
常见错误现象：color 写了但链接还是蓝色/紫色——大概率是没覆盖到对应状态（比如只写了 a { color: red; }，但浏览器默认对 a:visited 有更高优先级），或者被父级 color 继承覆盖了。
- 支持所有标准颜色值：
red、#007bff、rgb(0, 123, 255)、hsl(208, 100%, 50%) - 透明度需用
rgba()或hsla()，color: #007bff80这种写法在部分旧浏览器不兼容 - 不能用
font-color—— 这个属性根本不存在，是初学者常打错的
a:link、a:visited、a:hover、a:active 必须按顺序写
这四个伪类不是随便排列的。浏览器按声明顺序层叠，如果 a:visited 写在 a:hover 后面，鼠标悬停时可能仍显示已访问色。
使用场景：你想让未访问链接是蓝色、已访问变灰色、悬停变深蓝、点击瞬间变橙色——那就得严格按这个顺序：
a:link { color: #007bff; }
a:visited { color: #6c757d; }
a:hover { color: #0056b3; }
a:active { color: #ff6b35; }
-
a:link只匹配带href的未访问链接；没href的a标签不触发它 -
a:visited受浏览器安全限制：现代 Chrome/Firefox/Safari 禁止用 JS 读取其样式，CSS 中也禁用text-shadow、transform等非色彩类属性 -
a:hover失效？先检查是否被pointer-events: none的父容器挡住，或被空div盖住了
内联 style="color: xxx" 只影响默认状态
写 @#@#@#@#@#@#@#@#@#@0，红色只在未访问且未悬停时生效。一旦用户点过，a:visited 规则就会接管；鼠标移上去，a:hover 又会覆盖。
所以它适合临时调试或极简页面，不适合真实项目。
- 漏引号、用中文冒号、拼错
color是最常见失效原因 - 别用
<font color="red"></font>：HTML5 已废弃，且完全无法控制:hover等状态 - 如果用了
!important强制颜色，后续同选择器的规则就很难再覆盖它，容易埋坑
多页面统一管理必须用外部 CSS 文件
把链接样式写进单独的 styles.css，然后每页用 <link rel="stylesheet" href="styles.css"> 引入——这是唯一靠谱的长期方案。
否则首页改了颜色，文章页忘了同步，用户点进不同页面看到链接色不一致，体验直接掉档。
- 外部文件里可以放心用
@import拆分规则，比如把导航链接和正文链接分开定义 - 注意路径问题：
href="css/styles.css"和href="../css/styles.css"容易写错，建议用相对根路径/css/styles.css避免嵌套层级干扰 - 别把所有样式塞进一个大文件里——
a相关规则集中放在顶部，方便团队成员快速定位
color，而是理清状态优先级、处理浏览器对 :visited 的限制、以及跨页面样式同步时的路径和缓存问题。这些地方一疏忽，颜色就“看起来没生效”。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
