移动端超链接样式需适配触摸交互与多端渲染差异：优先用a:active而非:hover实现按压反馈，禁用cursor:pointer；a:visited受限严格，仅color等少数属性有效；微信webview需避免内联style，用class+!important；retina屏可加-webkit-text-stroke锐化字体。
移动端页面改超链接颜色，和桌面端原理一样，但必须考虑触摸交互、高DPI屏幕适配、以及 Safari/Chrome for iOS 的渲染差异。直接写 a { color: red; } 很可能在 iPhone 上不生效，或者 hover 效果错乱。
移动端 a:hover 不生效？别硬加 cursor: pointer
移动端没有“悬停”概念，a:hover 在 iOS Safari 和 Android Chrome 中默认只在点击后短暂触发（且仅限可点击区域），不是持续响应。强行依赖 a:hover 会导致视觉反馈延迟或完全丢失。
- 真正该用的是
a:active—— 它在手指按下瞬间触发，是移动端最可靠的交互态钩子 - 不要给
a加cursor: pointer，它在 iOS 上无效，还可能干扰点击区域检测 - 如果想模拟“按下去变色”，写
a:active { color: #555; }就够了，别套 JS 或ontouchstart模拟 - 某些安卓 WebView 会忽略
:active，需加-webkit-tap-highlight-color: transparent;清除点击高亮干扰
a:visited 在 iOS 上几乎不可控
iOS Safari 对 a:visited 施加了严格限制：只允许修改 color、background-color、border-color 等极少数属性，且颜色值不能通过 JS 读取——这意味着你写的 a:visited { color: purple; } 可能显示为灰色，甚至被浏览器强制降级为默认紫色。
- 别指望用
a:visited做精确状态区分，尤其在需要品牌一致性的场景 - 如果必须弱化已访问感，统一用浅灰
#999比用purple更可靠 - 避免在
a:visited里设text-decoration: none或font-weight，这些会被忽略
内联 style="color: ..." 在微信内置浏览器里容易失效
微信 WebView（X5 内核）对内联样式的解析比标准浏览器更激进，父容器的 color 或 !important 规则很容易覆盖单个 a 的 style。
- 优先用 class 控制，比如
@#@#@#@#@#@#@#@#@#@0，再配 CSS：.link-primary { color: #007bff !important; } - 如果非要用内联，确保颜色值带单位（如
rgb(0,123,255)而非rgb(0,123,255,1)）且不含空格 - 微信中
style="color:#007bff"有时会因 HTML 压缩丢掉引号，变成style=color:#007bff—— 浏览器直接忽略
字体颜色在 Retina 屏上发虚？检查是否漏了 -webkit-text-stroke
部分 iOS 设备在高缩放比下渲染细字体链接时，纯 color 可能显得模糊，尤其小字号（12–14px）+ 浅色文字组合。
- 加一行
-webkit-text-stroke: 0.5px rgba(0,0,0,0.05);能轻微锐化边缘，不改变主色 - 慎用
text-shadow模拟描边，它在低端安卓机上易导致重绘卡顿 - 若链接文字小于 16px，iOS 默认禁用缩放，此时
color值必须足够对比度（WCAG AA 要求至少 4.5:1）
真正麻烦的不是怎么写 color，而是不同 WebView 对伪类的支持粒度差异太大——一个在 Chrome for Android 正常的 a:active，到了 QQ 浏览器 X5 内核里可能压根不触发。上线前务必真机连调试器测三端（iOS Safari、微信、安卓 Chrome）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
