home • class links • multiple nav areas • background images

How do you add a background image to link?

   
  #sidebar a:link {
	font: bold small-caps 2em/1.5em helvetica,sans-serif;
	color:#FFF;
	text-decoration: none;
	background-image: url(images/fish1.png);
	text-align: center;
	display: block;
	height: 48px;
	width: 200px;
    }
    
#sidebar a:visited {
		color: #FFF;
    }
   
#sidebar a:hover {
  	color: #F90;
  	background-image: url(images/fish2.png);
    }

#sidebar a:active {
  	color: #000;
    }

 

It's easy! Just add a background image to the CSS declarations for a:link and a different background image to the declarations for a:hover.