CSS :visited Pseudo-class

Definition and usage

CSS :visited Pseudo-classes are used to set the style of visited links.

Tip:Use :link Set the link style for unvisited pages, using :hover Set the link style when hovered over, using :active Set the link style when clicked.

Note:To correctly set the link styles, please place :visited The rule is placed :link after the rule, but before :hover and :active before the rule.

Styles allowed include:

• color
• background-color
• border-color (and each side's border-color)
• outline color
• column-rule-color
• text-decoration-color
• text-emphasis-color
• SVG attributes fill and stroke

Example

Example 1

Select and set styles for visited links:

a:visited {
  color: pink;
}

Try it yourself

Example 2

Select and set styles for unvisited, visited, hovered, and active links:

/* Unvisited link */
a:link {
  color: green;
}
/* Visited link */
a:visited {
  color: green;
}
/* Hovered link */
a:hover {
  color: red;
}
/* Active link */
a:active {
  color: yellow;
}

Try it yourself

Example 3

Set different styles for links:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

Try it yourself

CSS Syntax

:visited {
  css declarations;
}

Technical details

Browser support

The numbers in the table indicate the first browser version that fully supports the pseudo-class.

Related pages

Tutorial:CSS Links

Tutorial:CSS Pseudo-classes