使用 a:visited 可设置已访问链接的样式，如 color、background-color 等，但受隐私保护限制，仅允许修改颜色类属性；为避免覆盖，应按 LVHA 顺序定义 link、visited、hover、active 状态。
通过
:visited伪类，你可以为用户已经访问过的链接设置特定样式。这在提升用户体验方面很有帮助，能让用户清楚知道哪些页面他们已经看过。
基本语法
使用
a:visited可以为已访问的链接定义样式。它需要作用在
标签上，并且只有在链接的
href属性存在时才会生效。 a:visited {
color: purple;
text-decoration: underline;
}
可设置的CSS属性限制
出于隐私保护的原因，现代浏览器对
:visited能修改的CSS属性做了严格限制。你只能安全使用以下几种：
- color：文字颜色
- background-color：背景色
- border-color：边框颜色（不包括边框宽度或样式）
- outline-color：轮廓颜色
不能通过
:visited修改尺寸、字体、显示方式或添加内容等，否则样式可能不会生效。
立即学习“前端免费学习笔记（深入）”；
与其他伪类的顺序建议
为了确保样式正确应用，推荐按照 LVHA 顺序书写链接状态：
a:link { color: blue; } /* 未访问 */a:visited { color: purple; } /* 已访问 */
a:hover { color: red; } /* 鼠标悬停 */
a:active { color: orange; } /* 点击瞬间 */
这个顺序能避免样式被覆盖，特别是
:visited容易被
:hover或
:link意外覆盖。
实际示例
下面是一个实用的例子，区分已访问和未访问链接：
a:link {color: #0066cc;
text-decoration: none;
}
a:visited {
color: #800080;
background-color: #f0f0f0;
}
a:hover {
color: #ff6600;
text-decoration: underline;
}
基本上就这些。只要注意浏览器的安全限制和书写顺序，就能有效用
:visited提升链接的视觉反馈。不复杂但容易忽略细节。
