:visited

概述

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

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

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

限制

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

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

示例

未设置颜色或透明的属性不能使用:visited。 在可以使用此伪类设置的属性中,浏览器可能只有colorcolumn-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 Status

Comment

HTML Living Standard
:visited
Living Standard
Selectors Level 4
:visited
Working Draft 无变化。
Selectors Level 3
:visited
Recommendation 无变化。
CSS Level 2 (Revision 1)
:visited
Recommendation 取消:visited只适用于 <a> 元素的限制。由于隐私原因,浏览器会限制该行为。
CSS Level 1
:visited
Recommendation 初次定义。

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 1.0 (1.7 or earlier) 3.5 3.5 1.0
Restrictions in CSS properties allowed in a statement using :visited 6 4.0 (2.0) 8 (or earlier) ? 5.0
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? 1.0 (1.0) ? ? ?

参见