我看过的每个示例和样式表都使用a:visited
来设置链接样式。除a:visited
具有更高的特异性外,:visited
不应该等同且更简单吗?
答案 0 :(得分:48)
TL; DR:在撰写本文时,您完全正确; a:visited
和:visited
之间没有区别。但是,使用a:visited
是未来验证代码的最佳做法。
TL; DR EDIT:截至2016年8月,CSS4工作草案允许其他代码使用:visited
。现在a:visited
和:visited
之间存在功能差异!当心。强>
对于今天的网络开发语言,特别是HTML5和CSS3,你说得对:{strong>功能在a:visited
和:visited
之间没有区别。现在,请谨慎对待:Web标准,元素和用户界面协议不断发展,这意味着将来可能会引入与:visited
兼容的新标签。
在CSS中引入:visited
时,W3C CSS1 spec说:
在CSS1中,锚点伪类对' a'以外的元素没有影响。因此,可以从选择器中省略元素类型:
a:link { color: red }
==:link { color: red }
HOWEVER ,在CSS2 spec中,:visited
伪类的行为并不仅限于a
个标记:
文档语言确定哪些元素是超链接源锚点。例如,在HTML4中,链接伪类适用于带有" href"的
a
元素。属性。
这意味着由文档语言和浏览器决定哪些元素与:visited
兼容。虽然目前的行业标准规定,对于HTML,只有a
属性的href
元素符合条件,但这可能会在以后的行中发生变化。
编辑,2016年8月:看起来CSS4 Working Draft证实了我的怀疑;在新规范中,:visited
可用于其他类似链接的&#34;元素,即<area>
和<link>
。规范说:
:any-link伪类表示充当超链接的源锚点的元素。例如,在[HTML5]中,具有href属性的任何
<a>
,<area>
或<link>
元素都是超链接。
因此<a>
,<area>
和<link>
都被视为超链接,规范称:visited
适用于所有超链接。因此,从CSS4开始,您最好在a
中加入a:visited
。
答案 1 :(得分:14)
根据Selectors Level 4 :visited
适用于任何超链接,当HTML为<a>
,<area>
和<link>
元素时,这些超链接具有{{1}属性。
对href
元素的快速测试表明,Firefox至少部分尊重这一点:
在FF中尝试http://jsfiddle.net/rfdzpjLo/4/或参见下面的
link
&#13;
link:before { content:attr(href); }
link { display:block; }
:visited { color: red; }
:link { color:green; }
&#13;
答案 2 :(得分:5)
是的,但是如果引入了可能使用:visited
设置样式的新标记,则它将来不会兼容。
我能找到最贴近的证据:
http://www.w3.org/TR/CSS21/selector.html#link-pseudo-classes
文档语言确定哪些元素是超链接源锚点。例如,在HTML4中,链接伪类适用于具有“href”属性的A元素。因此,以下两个CSS 2.1声明具有类似的效果:
a:link { color: red }
:link { color: red }
答案 3 :(得分:4)
理论上,由于已经提到的原因,情况也是如此。在纸面上,a:visited
vs :visited
明确表示该样式仅适用于锚点,并且可能更快:将其视为需要遍历所有a
标记的浏览器一方面,检查:visited
是否适用,与DOM中的所有标签相同。
例如,假设这个访问过的链接:
<a id="foo" class="bar" href="...">visited link</a>
然后考虑以下CSS:
#foo {
color: red;
}
.bar {
color: green;
}
:visited {
color: purple
}
曾经有一段时间,根据浏览器的不同,链接会显示为红色,绿色或紫色。 (也许情况仍然如此;我还没有经过测试。)因为,有些人认为#foo
比.bar
更重要(它是一个ID与一个类)出于类似的原因,这两者比:visited
更重要。有些会将#foo
,.bar
和:visited
视为标记本身的属性,就好像它们具有相同的重要性一样。有些人可能会将#foo
和.bar
视为平等,但比:visited
更重要,理由是后者仅仅是伪类。等等。
现在,考虑一下这个CSS,这是你今天在样式表中可能遇到的那种东西:
a.bar {
color: green;
}
:visited {
color: purple
}
即使假设标签,ID,类和伪类都被视为相同,我们仍然存在潜在问题,因为某些浏览器也可以认为a.bar
比普通:visited
更具体。
因此,您最终需要在声明中指定a:visited
以确保所有浏览器中的行为都是一致的 - 并且可能仍然存在一些不好的苹果,并且会让您想要写a:visited, a.bar:visited
只是为了确定。
一旦你遇到问题几次,习惯就会开始,你最终会写a:hover
或a:visited
。
答案 4 :(得分:1)
:visited
是一个伪类选择器,仅对 用于锚链接元素,当此浏览器过去访问过该锚链接的href属性时,该链接元素匹配。它对用户来说意味着有用的反馈,因此他们可以区分他们所处的链接和他们没有的链接。
<强> REFERENCE 强>
伪类的语法如下
selector:pseudo-class {
property:value;
}
因此,在使用伪类时必须使用选择器,因为它只支持链接,在这种情况下,选择器将是a
。