Learn CSS: Pseudo Classes - The :active Pseudo Class
(Page 4 of 5 )
The :active pseudo class applies the styling rules while the user is clicking on the element. It's supported by IE 5.5 and 6, Mozilla 1.7 and Opera 7.5. As with the :hover pseudo class, the :active class applies only to hyperlinks with IE, but in Mozilla it can be applied to any element. For this example, I will add a <p> element to the HTML code and two more CSS rules to the CSS code, which apply the hexadecimal background color #F6D5D5 and the text color #CC00CC to the active hyperlinks and the active paragraphs in the document. In the first following browser window the user is clicking on the first link; in the second window the user is clicking the paragraph. Add the following <p> element just before the closing tag of the <body> element:
<p>This is a paragraph text</p>
And add the following two CSS Rules to the CSS code file:
a:active
{
background-color: #F6D5D5;
color: #CC00CC;
}
p:active
{
background-color: #F6D5D5;
color: #CC00CC;
}
Next: The :focus Pseudo Class >>
More Style Sheets Articles
More By Michael Youssef
/ 17 
