正确使用CSS的:link和:visited伪类可区分未访问和已访问链接，提升用户体验；需遵循LVHA顺序避免样式覆盖，并注意浏览器对:visited样式的安全限制。
在网页设计中，为了让用户清楚地区分哪些链接已经访问过，哪些还没有，可以通过CSS的 :link 和 :visited 伪类来设置不同颜色。这两个伪类分别代表链接的不同状态，正确使用它们可以提升用户体验。
:link 与 :visited 的基本作用
:link 用于设置尚未被用户点击过的超链接样式；:visited 则用于设置用户已经访问过的链接样式。两者都只能应用于带有 href 属性的 标签。
常见用法如下：
a:link {
color: blue; /* 未访问的链接为蓝色 */
}
a:visited {
color: purple; /* 已访问的链接变为紫色 */
}
CSS书写顺序的重要性
为了确保样式正确生效，推荐遵循“LVHA”顺序（Link → Visited → Hover → Active）。如果顺序错误，可能导致某些样式被覆盖。
立即学习“前端免费学习笔记（深入）”；
正确示例：
a:link { color: blue; }
a:visited { color: green; }
a:hover { color: red; }
a:active { color: orange; }
若将 a:visited 写在 a:link 后面，可能会导致未访问链接也显示为已访问的颜色，因为后定义的规则优先级更高。
浏览器安全限制说明
出于隐私保护，现代浏览器对 :visited 可修改的样式做了限制。虽然可以更改颜色，但不能通过JavaScript获取是否为已访问链接，也不能读取这些样式的计算值。
允许设置的属性包括：
colorbackground-colorborder-coloroutline-color
其他大多数外观属性在 :visited 中可能无效或被忽略。
基本上就这些。只要按规范写好选择器顺序，并理解浏览器的安全策略，就能轻松实现链接状态的颜色区分。不复杂但容易忽略细节。
