:visited

**:visited** CSS 伪类在用户访问过链接后应用。出于隐私原因，可以使用此选择器修改的样式非常有限。:visited 伪类仅应用于具有 href 属性的 <a> 和 <area> 元素。

尝试一下

通过 :visited 和未访问的 :link 伪类定义的样式可以被任何后续的用户操作伪类（:hover 或 :active）覆盖，只要这些伪类的特异性至少相等。为了正确地设置链接的样式，请将 :visited 规则放在 :link 规则之后，但在 :hover 和 :active 规则之前，如 *LVHA-order* 中定义的：:link — :visited — :hover — :active。:visited 伪类和 :link 伪类是互斥的。

隐私限制

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

允许的 CSS 属性为 color、background-color、border-color、border-bottom-color、border-left-color、border-right-color、border-top-color、column-rule-color、outline-color、text-decoration-color 和 text-emphasis-color.
允许的 SVG 属性为 fill 和 stroke。
允许的样式的 alpha 分量将被忽略。将使用元素的非 :visited 状态的 alpha 分量。在 Firefox 中，当 alpha 分量为 0 时，:visited 中设置的样式将完全被忽略。
尽管这些样式可以改变最终用户对颜色的感知，但 window.getComputedStyle 方法会撒谎，并且始终返回非 :visited 颜色的值。
<link> 元素永远不会被 :visited 匹配。
通过 CSS 选择器匹配元素的 DOM 方法（例如 querySelector() 和 querySelectorAll()）始终会返回“空”结果，即使文档中存在已访问的链接。对于上述方法，这将分别为 null 或空的 NodeList。

注意：有关这些限制及其原因的更多信息，请参阅隐私和 :visited 选择器。

语法

css

:visited {
  /* ... */
}

示例

本来没有颜色或透明的属性不能使用 :visited 修改。在可以使用此伪类设置的属性中，您的浏览器可能只有 color 和 column-rule-color 的默认值。因此，如果要修改其他属性，需要在 :visited 选择器之外为它们提供一个基本值。

HTML

html

<a href="#test-visited-link">Have you visited this link yet?</a><br />
<a href="">You've already visited this link.</a>

CSS

css

a {
  /* Specify non-transparent defaults to certain properties,
     allowing them to be styled with the :visited state */
  background-color: white;
  border: 1px solid white;
}

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

结果

规范

规范
HTML 标准 # selector-visited
选择器级别 4 # 链接

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅

隐私和 :visited 选择器
与链接相关的伪类：:link、:active、:hover