:visited

概述

:visited CSS伪类表示用户已访问过的链接。出于隐私原因，可以使用此选择器修改的样式非常有限。

/* 所有被访问过的 <a> 变绿 */
a:visited {
  color: green;
}

这个样式可能会被后声明的其他链接相关的伪类覆盖，这些伪类包括 (:link, :hover,和:active)。要适当地设置链接样式，请将:visited 规则放在:link 规则之后，但在:hover 和:active 规则之前，参照 LVHA 顺序::link — :visited — :hover — :active。

限制

出于隐私原因，浏览器严格限制您可以让此伪类应用的样式，以及使用它们的方式：

允许使用的 CSS 属性为color, background-color, border-color, border-bottom-color, border-left-color, border-right-color, border-top-color, column-rule-color, 和outline-color。
允许使用的 SVG 属性为fill 和 stroke。
允许使用的样式的 αlpha 分量 (透明度) 将被忽略。设置在:visited中的样式将使用元素的非:visited 访问状态的 αlpha 分量，如果该分量为 0，这个样式将被完全忽略。
虽然这些样式可以改变用户最终的颜色外观，但 window.getComputedStyle 方法将存在并且始终返回非访问颜色的值。

备注： 有关这些限制及其背后原因的更多信息，请参阅 Privacy and the :visited selector。

示例

未设置颜色或透明的属性不能使用:visited。在可以使用此伪类设置的属性中，浏览器可能只有color和column-rule-color两个默认值。因此，对于其他属性，在使用:visited选择器前，应该先为这些属性设置基础样式。

HTML

<a href="#test-visited-link">你是否访问过此链接？</a>
<a href="">你已经访问过此链接。</a>

CSS

a {
  /* 指定某些属性的默认值，允许他们使用：visited 状态进行样式设置 */
  background-color: white;
  border: 1px solid white;
}

a:visited {
  background-color: yellow;
  border-color: hotpink;
  color: hotpink;
}

结果

规范

Specification
HTML Standard # selector-visited
Selectors Level 4 # link

浏览器兼容性

BCD tables only load in the browser

参见

Privacy and the :visited selector
链接相关伪类::link，:active，和:hover。