CSS :active Selector

Example

How to style active links:

a:active
{
background-color:yellow;
}

Try it yourself »

The :active selector styles links to active pages.

A link becomes active when you click on it.

Tip: Use the :hover selector to style links when you mouse over them.

Note: :hover MUST come after :link and :visited (if they are specified) in the CSS definition in order to be effective!

Note: :active MUST come after :hover (if specified) in the CSS definition in order to be effective!

The :active selector is supported in all major browsers.

The :active selector was first introduced in:

CSS 1

CSS tutorial: CSS Links

How to style a link, unvisited, visited, active, and when you mouse it:

a:link {color:green;}
a:visited {color:green;}
a:hover {color:red;}
a:active {color:yellow;}

Try it yourself »

How to give different links different styles:

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

Try it yourself »