Link Pseudo — CSS

Link Pseudo-Classes (:link, :visited, :any-link)

Anchor elements have their own small family of pseudo-classes for distinguishing links a user hasn't clicked yet from ones they have, on top of the general-purpose :hover, :focus, and :active covered elsewhere.

:link — unvisited links

:link matches an anchor with an href attribute that the browser does NOT consider visited. Anchors without an href (used purely as JS hooks or named fragments) never match :link.

CSS

a:link {
  color: #2563eb;
  text-decoration: underline;
}

:visited — visited links

:visited matches a link the browser's history shows the user has already been to.

CSS

a:visited {
  color: #7c3aed;
}

Browsers deliberately limit :visited styling

For privacy reasons, browsers severely restrict which properties can actually be applied via :visited. If arbitrary styling were allowed, a malicious page could measure rendering differences (e.g. via `getComputedStyle`, layout timing, or image requests triggered by different backgrounds) to detect which links you'd visited before — effectively sniffing your browsing history. To prevent that, only a small set of mostly color-related properties are honored on :visited: `color`, `background-color`, `border-color` and similar outline/column-rule colors, and the color component of `text-decoration` / `text-emphasis`. Properties like `display`, layout, or anything that could be measured indirectly are ignored.

:any-link — a convenient shorthand

:any-link matches an anchor whether it has been visited or not — it's equivalent to :is(:link, :visited), and is handy when you want a base style that applies regardless of visited state, without duplicating the rule.

CSS

/* Base styling that should apply no matter the visited state */
a:any-link {
  font-weight: 500;
  text-decoration: none;
}

/* Then differentiate only what actually needs to differ */
a:link {
  color: #2563eb;
}

a:visited {
  color: #7c3aed;
}

The LVHA order

When styling interactive links, order matters. Because :link, :visited, :hover, and :active can all match the same anchor at different points, and CSS resolves ties between equal-specificity rules by "last one wins," these four rules should always be declared in this order:

CSS

a:link {
  color: #2563eb;
}

a:visited {
  color: #7c3aed;
}

a:hover {
  color: #1d4ed8;
}

a:active {
  color: #1e3a8a;
}

Link — unvisited state, declared first.
Visited — must come after :link so a visited link doesn't silently keep the unvisited color.
Hover — must come after :visited so hovering a visited link still shows the hover color.
Active — declared last so the active/pressed color always wins over hover or visited.

Note

This "LVHA" order is a mnemonic, not a CSS feature — CSS itself does not know these four are related. If you write `:hover` before `:link`, you'll get bugs where hovering a link seems to do nothing because the later `:link` rule (same specificity) overrides it. See the user-action pseudo-classes page for more on how `:hover`, `:focus`, and `:active` behave in general.