CSS: a:link vs只有a(没有:link部分)

Question

因此，我们需要对CSS锚伪类使用以下顺序

a:link    { color: red }    
a:visited { color: blue }  
a:hover   { color: yellow } 
a:active  { color: lime }  

但我的问题是，为什么要麻烦a:link部分呢？更确切地说，以上是否有任何优势(也许不是清晰度)：

a { color:red; } /* notice no :link part */
a:visited { color: blue; }
etc.,etc.

Answer 1

:link选择未访问的链接，即:具有href属性的锚点，这些锚点还没有被浏览器访问过(无论浏览器供应商对“已访问”有什么定义)。

如果它有:link，那么它永远不会与<h1><a name="foo">A foo to be linked to</a></h1>匹配

(尽管您现在应该使用<h1 id="foo">A foo to be linked to</h1>。)

除此之外，它确实让它的用途变得更加清晰。

​

a         { color: orange }
a:link    { color: blue }    
a:visited { color: indigo }  
a:hover   { color: green } 
a:active  { color: lime }

  <a>my anchor without href</a>
  <br><br>
  <a href="http://somelinkhere.com">my anchor without href</a>

​

(它们也有不同级别的specificity)

Answer 2

"a“指的是所有可能的链接(未访问的、已访问的、悬停的和活动的)，而"a:link”只是指正常的未访问的链接。

如果使用"a“而不是"a:link"，则会将所有链接的默认CSS设置为"a”设置为什么值。在这个特定的例子中，因为您指定了每个可能的伪类，所以您说"a:link“还是只说"a”实际上并不重要。

因此，在第一组中，您将写出所有伪类(a:link、a:visited等)，您将为"a“中的每种可能的情况指定CSS。

a:link    { color: red }     //set unvisited links to red 
a:visited { color: blue }    //set visited links to blue
a:hover   { color: yellow }  //set hovered links to yellow
a:active  { color: lime }    //set active links to lime

在第二组中，您只需编写"a"，实际上是将所有链接的默认CSS设置为您在第一行中编写的内容，然后重新定义其他伪类的CSS

a    { color: red }          //set ALL links to red!
a:visited { color: blue }    //hm, never mind, let's set visited links to blue
a:hover   { color: yellow }  //hm, never mind, let's set hovered links to yellow
a:active  { color: lime }    //hm, never mind, let's set active links to lime

Answer 3

http://www.w3schools.com/css/css_pseudo_classes.asp

:link是指链接未被访问时。因此，当存在具有href属性的锚点，并且用户从未访问过该锚点后面的页面时。