一个奇怪的:链接

时间:2014-06-11 10:42:18

标签: html css css-selectors pseudo-class

我的HTML:

<a href="http://google.fr">Google</a><br>
<a href="http://wikipedia.org">Wikipedia</a>

CSS:

a:link {
text-decoration: none
}

我只设计未访问的链接(逻辑上,a:链接样式未访问的链接),但即使访问过的链接也会丢失下划线。为什么呢?

更新:JSFiddle:http://jsfiddle.net/M8AyL/

4 个答案:

答案 0 :(得分:2)

我认为这是因为没有为链接设置其他属性。因此,所有访问过的链接也会受到:链接。

a:visited {
text-decoration: underline;
}

获得所需的结果。

答案 1 :(得分:2)

正如Hashem Qolami commentsMDN states the reason所述,{{3}}:

  

注意:出于隐私原因,浏览器会严格限制您的样式   可以使用:visited伪类选择的元素来应用:

     

color,   background-colorborder-colorborder-bottom-color,   border-left-colorborder-right-colorborder-top-color,   outline-colorcolumn-rule-colorfillstroke

答案 2 :(得分:1)

我认为你的意思是:visited伪元素因为MDN for :link状态:

  

:链接CSS伪类允许您选择元素内的链接。这将选择任何链接[...]

答案 3 :(得分:0)

  

:链接CSS伪类允许您选择元素内的链接。这将选择任何链接,甚至那些已经使用选择器与其他与链接相关的伪类进行样式化的链接,例如:hover,:active或:visited。 为了仅设置非访问链接的样式,您需要将:链接规则放在其他链接之前,如LVHA订单所定义:: link - :visited - :hover - :active。 :焦点伪类通常放在之前或之后:悬停,取决于预期的效果。

现在是退出学习w3schools

等误导性资源的好时机