Difference between “a” and “a:link”

2019-01-15 19:22发布

问题:

What is the difference between a and a:link, and when do I use one over the other?

回答1:

a:link is specifically for links that have not been visited. a applies to all <a> elements.



回答2:

John Conde’s answer and comments to it describe well the meanings of the selectors, but to address the question as asked I think we need to add these:

The selector a:link is more specific than a. This is evident when you think about it, but it might be missed when considering the effects of several CSS rules that apply to an element.

If you want to set properties on links in general (e.g., the font face of links), using a is simplest if you can ensure that a elements without href attributes do not appear. (It has been common to set destinations for links using a elements with a name attribute, normally without an href attribute; the more modern approach is to use the id attribute on any suitable element.)

But in most cases, it is best to use both :link and :visited, to avoid the risk of styling a elements that are not links. You would then use :link, :visited {...} to set properties for all links and :link {...} and :visited {...} to set properties for unvisited links and for visited links separately (typically, different colors for them).

The difference between :link and a:link, apart from specificity, is that :link covers elements that are classified as links. Although currently only a elements can create links, this might change in a future version of HTML.