什么是：any-link伪类为？ [英] What's the :any-link pseudo-class for?

问题描述

我不知道它是否是任何标准的一部分，但至少有两个主要的浏览器已经实现它：

• ： - webkit-any-link 在Chrome中


• ： - moz-any-link 在Firefox中

我找不到任何文档。我想知道其目的，浏览器支持和使用示例。

解决方案

：any- link 是在 Selectors level 4 中提出的新伪类， a>，它匹配将被：link，：visited 匹配的所有元素。从我看到的，它的主要目的是简化需要选择任何超链接的选择器，因为：link 的命名是误导;它特别意味着只有未访问的链接，而不是所有的超链接（这使它基本上与： c>： c>相反）。

在HTML中，超链接具体指以下任意一项：




• An < a& ;具有 href 属性的元素。这不包括命名的锚点（即，没有 href 属性的< a> 元素， $ c> name 属性），它们通常用于标记页面中的锚点，现在通过在任何元素上使用 id 属性。请参见 HTML 4中的命名定位点 。




• 具有 href 属性的元素< area> / p>




• A < link> 元素中有 href 属性。

HTML5规范列出了上述元素作为与：link 和

例如，假设页面标题中的链接应与所有其他链接的颜色不同：

  body>标题> a：link，body>标题> a：visited {
 color：white; 
} 
  

注意 body&头部分在两个选择器之间重复。这似乎是多余的，但是目前需要为了在页眉中的颜色链接不同于其余，而是，而不管他们的访问状态。这是因为 body>标题>一个不够具体，需要使用！important 来覆盖， body>标题> a：link 麻烦只适用于未访问的链接。

使用：any-link pseudo-class，你可以简单地这样做：

  body&标题> a：any-link {
 color：white; 
} 
  

特殊性是完全一样的，所以不应该有任何问题。

当然，由于没有浏览器实现它的前缀，这将无法工作。或者，考虑到你最有可能使用HTML文档，无论如何你可以使用 a [href] ，它可以在所有浏览器包括IE7 +，并且也具体：

  body&标题> a [href] {
 color：white; 
} 
  

有关使用 a 与相比 a：link，a：visited code> a [href] 在这个我的另一个答案。

前缀在CSS中，： - moz-any-link 和： - webkit-any-link 仅用于实验目的，因此您不应该将它们与您的网站一起使用。此外，即使你现在使用它们，你必须复制规则本身（而不仅仅是选择器！），因为浏览器必须删除无法识别的选择器上的整个规则，使它们在现实世界的代码中变得毫无用处！

截至2013年初，我还没有其他实现：any-link 。我不确定这是否由相应的供应商实施，然后建议包含在选择器4中，或者如果它是在供应商开始实施之前初步指定的，但我不认为这是重要的。 >

说到这一点，一定不要混淆： - moz-any-link / ： -webkit-any-link 伪类与： - moz-any（） / ： - webkit-any ），后者是指定为：matches（） （可能避免命名混淆？）。

I don't know if it's a part of any standard, but at least two major browsers have implemented it:

• :-webkit-any-link in Chrome
• :-moz-any-link in Firefox

I can't find any documentation for it. I would like to know its purpose, browser support, and examples of usage.

解决方案

:any-link is a new pseudo-class proposed in Selectors level 4, that matches all elements that would be matched by :link, :visited. From what I see, its main purpose is to simplify selectors that need to select any hyperlinks, since the naming of :link is misleading; it specifically means unvisited links only, rather than all hyperlinks (which makes it essentially the opposite of :visited).

In HTML, a "hyperlink" specifically refers to any one of:

• An <a> element that has an href attribute. This excludes named anchors (that is, <a> elements without an href attribute but instead with a name attribute), which were used traditionally to mark anchors in a page, now superseded by the use of an id attribute on any element. See named anchors in HTML 4.

• An <area> element that has an href attribute.

• A <link> element that has an href attribute.

The HTML5 spec, lists the above elements as those matching the :link and :visited selectors.

For example, consider a scenario where links in the page header should be colored differently from all other links:

body > header > a:link, body > header > a:visited {
    color: white;
}

Notice the body > header part is duplicated across both selectors. This seems redundant, but is currently necessary in order to color links in the page header differently from the rest, but regardless of their visited state. This is because body > header > a is not specific enough which requires using !important to override anyway, and body > header > a:link troublesomely only applies to unvisited links.

With the :any-link pseudo-class, you can simply do this instead:

body > header > a:any-link {
    color: white;
}

The specificity is exactly the same, so there should be no issues regarding that.

Of course, since no browser implements it unprefixed yet, that won't work. As an alternative, considering you're most likely working with an HTML document anyway you can just use a[href] instead, which works in all browsers including IE7+ and is also equally specific:

body > header > a[href] {
    color: white;
}

There's a much more elaborate explanation regarding the use of a versus a:link, a:visited versus a:any-link versus a[href] in this other answer of mine.

Like anything else that has a prefix in CSS, :-moz-any-link and :-webkit-any-link exist only for experimental purposes, so you shouldn't use them with your sites. Besides, even if you were to use them right now, you'd have to duplicate the rules themselves (and not just the selectors!) since browsers have to drop entire rules on unrecognized selectors, rendering them pretty useless in real-world code!

As of early 2013, no other implementations of :any-link exist that I know of. I'm unsure as well as to whether this was implemented by the respective vendors and then proposed for inclusion in Selectors 4, or if it was preliminarily specced before the vendors began implementing it, but I don't think that matters.

Speaking of which, be sure not to confuse the :-moz-any-link/:-webkit-any-link pseudo-class with :-moz-any()/:-webkit-any(), the latter of which is specced as :matches() instead (possibly to avoid naming confusion?).

这篇关于什么是：any-link伪类为？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！