:link and :visited, pseudo-classes related to links.

:visited

Description of the pseudo-classes :link and :visited.

These selectors refer to hyperlinks, in other words to the following HTML tags: a and area when an href attribute is present.

  • :link refers to unvisited links.
  • :visited on the contrary, refers to links that have already been visited.

Visited links stay in this state for a certain number of days, at the browser's discretion. The user can also clear the browsing history, which will reset all the links to unvisited.

Many conflicts can arise because the same link can be targeted both by the pseudo-class :link, by the pseudo-class :active, by the pseudo-class :any-link, and by a direct selector on the tags that contain the link, like a, area, etc. The rules are as follows:

  • The three pseudo-classes :link, :active, and :any-link have the same priority. So the rule that comes last will be the one that counts.
  • Selectors on the a, area, and link tags have lower priority, no matter where they are. So it's always the rules on pseudo-classes that are considered, even if they come before.

For a more complete explanation on resolving conflicts in CSS, check out the tutorial at Priorities.

Note: there is now a pseudo-class that allows you to target all links, visited or not: :any-link.

Examples of using link-related pseudo-classes.

Difference between visited links and unvisited links.

This first set of examples shows the difference between visited links and unvisited links. The former are shown in red, and unvisited links in gray. By clearing your browsing history, you can reset the already visited links back to their 'unvisited' state.

This link points to the current page.
So he's still in the visited state.
This link points to the W3C homepage.
It will be in the visited state once you've clicked it for the first time.
This link points to a non-existent page.
He will never be in the visited state.

Priority over the selector on a.

Tag selectors have a lower priority than pseudo-class selectors. As a result, the rule that targets a tags is never activated, even though it comes after the ones targeting the pseudo-classes :link and :visited.

This link points to the current page.
He is still in the visited state.
The rule regarding the a tag is not enabled.
This link points to a non-existent page.
He will never be in the visited state.
The rule regarding the a tag isn't enabled either.

Priority over :any-link.

The pseudo-class :any-link has the same specificity as the pseudo-classes :link and :visited. So it's the last rule encountered that is active, as shown in the example below.

This link points to the current page.
He is still in the visited state.
Le sélecteur :any-link venant après le sélecteur :visited, c'est lui qui est activé.
This link points to a non-existent page.
Il ne sera jamais dans l'état visité.
Le sélecteur :link venant après, c'est lui qui est activé.

Browser compatibility.

The pseudo-classes :link and :visited are well recognized by all browsers.

Column 1
Proper handling by browsers of the :link pseudo-class to target links.
Column 2
Proper handling by browsers of the :visited pseudo-class, which targets links that have already been visited.
1
:link
pseudo-class
2
:visited
pseudo-class
Estimated overall support.
97%
97%

Browsers on computers :

Mobile browsers :

Outdated or marginal browsers :

Internet Explorer

UC Browser pour Androïd

Opéra Mobile

QQ Browser

Baidu Browser

Safari

Samsung Internet

Opéra

Safari sur IOS

Firefox

Firefox pour Androïd

Edge

Chrome

Androïd Brower

KaiOS Browser

Chrome pour Androïd

Opéra mini

See Caniuse.com for more compatibility information.
Caniuse
Caniuse

History of pseudo-classes :link and :visited.

  • Cascading Style Sheets Level 2 - Revision 1 Specification

    This level 2 of the specification describes the mechanism of cascading styles in CSS. This language is used to format HTML or XML documents. It supports media-specific style sheets so that authors can adapt the presentation of their documents for visual browsers, auditory devices, printers, braille devices, portable devices, etc.

    Regarding :link Introduction of the :link and :visited pseudo-classes.
    WD
    November 04, 1997
    Working Draft.
    PR
    March 24, 1998
    Proposed for recommendation.
    REC
    May 11, 1998
    Recommendation .

  • Selectors Level 3

    This document describes the selectors that already exist in CSS1 and CSS2, and further introduces new selectors for CSS3 and other languages that may need them.

    Regarding :link No change to the :link and :visited pseudo-classes.
    WD
    August 03, 1999
    Working Draft.
    CR
    November 13, 2001
    Candidate Recommendation.
    PR
    December 15, 2009
    Proposed for recommendation.
    REC
    September 29, 2011
    Recommendation .

  • Selectors Level 4

    This specification module defines new selectors that can be used in CSS.

    Regarding :link No change to the :link and :visited pseudo-classes.
    WD
    September 29, 2011
    Working Draft.
    CR
    PR
    REC

See also...

Several pseudo-classes allow you to target links on a page, or parts of a page specified by the URL (bookmark). Check the pages describing the selectors below to complete your information.

:any-link
Pseudo-class targeting all links (visited or not), in other words, all elements that have an href attribute.
:link
Pseudo-class targeting unvisited hyperlinks.
⚠
:local-link
Pseudo-class targeting internal links, excluding links pointing to another domain.
:target
Langue française
A pseudo-class targeting the element whose id is in the url (bookmark).
::target-text
Langue française
Targets the text of the item designated by the url bookmark.
⚠
:target-within
Langue française
A pseudo-class targeting the parent container of the element whose id is in the url.
:visited
Pseudo-class targeting hyperlinks that have already been visited.