Подскажите пожалуйста с сменой картинок меню. - Вопросы по CSS

<div id="centerMenu">
	<a href="index.php" class="ere"><img>Мои данные</a>
	</br>
	<a href="index.php"><img>Моя карточка</a>
</div>

#centerMenu{
background-image:url(../images/centerMenu.jpg);
background-repeat:repeat-y;
width:196px;
height:300px;
text-align:left;	
padding-top:15px;
}

#centerMenu a {
text-decoration:none;
font-size:14px;
color:#525252;
font-weight:bold;
line-height:41px;
padding-left:8px;
}

#centerMenu a:hover {
color:#008AD6;
}

#centerMenu img{
height:34px;
width:34px;
background-image:url(../images/menu1.jpg);
background-repeat:no-repeat;
float:left;
margin-left:8px;
margin-top:4px;
}

#centerMenu img:hover{
background-image:url(../images/menu1Hover.JPG);
}

#centerMenu a {
text-decoration:none;
font-size:14px;
color:#525252;
font-weight:bold;
line-height:41px;
padding-left:8px;
background: url(путь к вашей картинке);
}

#centerMenu a:hover {
  color:#008AD6;
  background: url(путь к вашей картинке при наведении мыши на ссылку);
}

#centerMenu a {
  display:block; - для того что бы элемент отображался как блочный, и ему можно было присвоить ширину и высоту
  height: 40px;
}

 background: url(путь к вашей картинке при наведении мыши на ссылку) no-repeat 10px 20px;

	padding-left:41px;
	background:url(../images/menu1.jpg) no-repeat left center;
	display: block;
	margin:-15px 0 0 8px;