:any-link
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
The :any-link CSS pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited. In other words, it matches every <a> or <area> element that has an href attribute. Thus, it matches all elements that match :link or :visited.
Try it
p { font-weight: bold; } a:any-link { color: forestgreen; text-decoration-color: hotpink; } <p>Pages that you might have visited:</p> <ul> <li> <a href="https://developer.mozilla.org">MDN Web Docs</a> </li> <li> <a href="https://www.youtube.com/YouTube">Google</a> </li> </ul> <p>Pages unlikely to be in your history:</p> <ul> <li> <a href="https://developer.mozilla.org/missing-3">Random MDN page</a> </li> <li> <a href="https://example.com/missing-3">Random Example page</a> </li> </ul> Syntax
css
:any-link { /* ... */ } Examples
HTML
html
<a href="https://example.com">External link</a><br /> <a href="#">Internal target link</a><br /> <a>Placeholder link (won't get styled)</a> CSS
css
a:any-link { border: 1px solid blue; color: orange; } /* WebKit browsers */ a:-webkit-any-link { border: 1px solid blue; color: orange; } Result
Specifications
| Specification |
|---|
| Selectors Level 4 # the-any-link-pseudo |