CSS :activeSelectors

Complete CSS Selector Reference Manual

Example

Select the active link style:

a:active
{
background-color:yellow;
}

Try it Yourself »

Definition and Usage

:active adds a special style to an active link.

When you click a link, it becomes an active link.

Tip: :linkThe selector sets the style for unvisited page links.:visitedThe selector sets the style for visited page links.:hoverThe selector sets the style for links when the mouse hovers over them.

Note:To produce the expected effect, in CSS definitions, :active must come after :hover!!


Browser Support

The numbers in the table indicate the first browser version that supports the property.

Selectors
:active 4.0 7.0 2.0 3.1 9.6

Note:For all elements, IE8 and newer browser versions support the :active selector. For IE7, the :active selector only supports links.


Related Articles

CSS Tutorial:CSS Links

CSS tutorial: CSS Pseudo-classes


Examples

More Examples


Example

Links that are active, visited, unvisited, or have a mouse hovering over them:

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

Try it Yourself »

Example

Different link style options:

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

Try it Yourself »


Complete CSS Selector Reference Manual

other extensions