:any-link CSS Pseudo Class

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

Description

The CSS :any-link pseudo-class selector matches all elements that match the :link or :visited pseudo-classes. In other words, it matches every <a> or <area> element that has an href attribute, regardless of whether it has been visited or not.

This pseudo-class can be useful for styling all links on a page in a consistent way, regardless of their visitation status. For example, you could use the :any-link pseudo-class to set a base color for all links, and then use the :hover and :active pseudo-classes to add hover and active states.

Here is an example of how to use the :any-link pseudo-class:

/* Set a base color for all links */
:any-link {
color: blue;
}

/* Add a hover state for all links */
:any-link:hover {
color: red;
}

/* Add an active state for all links */
:any-link:active {
color: green;
}

The :any-link pseudo-class is still under development, but it is currently supported by all major browsers.

Note: The :any-link pseudo-class is not the same as the :link:not(:visited) pseudo-class selector. The :link:not(:visited) selector matches only unvisited links, while the :any-link selector matches both unvisited and visited links.

Syntax

:any-link {
  /* ... */
}

Example

<a href="https://example.com">External link</a><br />
<a href="#">Internal target link</a><br />
<a>Placeholder link (won't get styled)</a>
a:any-link {
border: 1px solid blue;
color: #800000;
}

Browser Support

The following table will show you the current browser support for the CSS :any-link pseudo class.

Desktop
Edge Chrome Firefox Opera Safari
796550529
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview
6550479965

Last updated by CSSPortal on: 1st October 2023