:visited
概述
限制
出于隐私原因,浏览器严格限制您可以让此伪类应用的样式,以及使用它们的方式:
- 允许使用的 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 | 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 | 初次定义。 |
浏览器兼容性
BCD tables only load in the browser