Selectors in action - step by step tutorial

Step 13 - styling a:hover

We need to use a descendant selector to set "hover" on the <a> element to achieve the rollover effect. This is done by adding a new background image and changing the color to white.

#navigation ul li a:hover
{
color: #fff;
background-color: #ccc;
background-image: url(nav_base2.jpg);
background-repeat: repeat-y;
}

View step 13 »

Go to Step 14 »

Other Max Design articles and presentations
Associated with webstandardsgroup.org