内联style="color:..."仅控制标签默认状态，无法影响:visited、:hover等伪类；需用css规则定义状态样式，并注意书写顺序与浏览器限制。
直接用 style="color: ..." 只影响默认状态
给 <a></a> 标签加 style="color: red;" 确实能立刻让那个链接变红，但它只管未访问、未悬停时的显示。一旦用户点过，:visited 会接管；鼠标移上去，:hover 也会覆盖它——除非你额外写 JS 或其他样式强行干预。
常见错误现象：style="color: #ff6b35" 写了但没生效，大概率是漏了引号、用了中文冒号或分号，或者父级元素（比如 <div style="color: gray;">）设置了更高优先级的 <code>color，把内联样式压住了。
支持的颜色写法包括：red、#007bff、rgb(0, 123, 255)、hsl(208, 100%, 50%)。别用 <font></font> 标签套，HTML5 已废弃，且照样不支持状态切换。
a:hover 和 a:visited 不能靠 style 属性控制
想让鼠标悬停时变色？style 属性做不到。浏览器不认 style="a:hover: color: orange;" 这种写法——它不是 CSS 规则，只是单个元素的内联声明。
必须用 <style></style> 块或外部 CSS 文件写伪类规则：
a:hover { color: #dc3545; }
a:visited { color: #6c757d; }
注意顺序：一定要按 a:link → a:visited → a:hover → a:active 的顺序写，否则 :visited 可能拦截 :hover，导致悬停无效。
另外，现代浏览器对 :visited 有安全限制：你只能改 color、background-color、border-color 等少数属性；像 font-size、display、transition 都会被忽略，不是你写错了，是浏览器故意不执行。
单个链接要多状态变色，得用 class 配合 CSS
如果就一个链接需要特殊交互效果（比如首页 banner 上那个主按钮），别每个状态都写一堆内联事件，更别用 onmouseover 调 JS 改 style.color——太重、难维护、还可能被 CSP 拦。
推荐做法是加 class，然后在 <style></style> 或外部 CSS 里定义整套状态：
<a href="#" class="hero-link">立即开始</a>
.hero-link:link { color: #007bff; }<br>.hero-link:visited { color: #6c757d; }<br>.hero-link:hover { color: #0056b3; text-decoration: underline; }<br>.hero-link:active { color: #003d7a; }
这样既保持 HTML 干净，又把所有状态逻辑收束到一处，后续调整颜色或加动画也只动 CSS。
多页面项目里硬塞 style 属性是最容易翻车的做法
如果你的网站有首页、产品页、博客页……每个页面都靠 style="color: #28a745;" 去改链接，等哪天品牌色从绿色改成青色，就得打开十多个文件逐个替换，漏一个就露馅。
真正省事的方式是抽离成外部 CSS 文件，比如 styles.css，里面只写：
a:link { color: #007bff; }
a:visited { color: #6c757d; }
a:hover { color: #0056b3; }
a:active { color: #003d7a; }
然后所有 HTML 页面统一引入：<link rel="stylesheet" href="styles.css">。改一次，全站生效。
最常被忽略的一点：很多人写了外部 CSS 却忘了在每个页面的 里加 <link>，或者路径写错（比如写成 css/styles.css 但实际在根目录），结果样式根本没加载——检查浏览器开发者工具的 Network 面板，看 styles.css 请求是否返回 200 是最快验证方式。
