Menu : rollover different selon bouton

bonjour

j'ai un menu vertical est je voudrais attribuer des rollover differents :

<ul id="menu_vertical">
	<li><a href="#">Accueil</a></li>
	<li class="vert"><a href="#">Pr&eacute;sentation</a></li>
	<li class="orange"><a href="#">Carte</a></li>
	<li class="turquoise"><a href="#">Carte (english)</a></li>
	<li class="vert"><a href="#">Galerie photos</a></li>
    <li class="jaune"><a href="#">Prochains RDV</a></li>
    <li class="violet"><a href="#">Partenaires</a></li>
    <li class="orange"><a href="#">Contact et plan d'acc&eacute;s</a></li>
</ul>

le css :

ul#menu_vertical{
	margin:0;
	padding:0;
	width:auto;
	list-style:none;
	text-align:center;
	color:#000000;
}

ul#menu_vertical vert a:hover{
background-image:
	background-image: url(../images/deco/bg_menu_rose.png);
	background-repeat: no-repeat;
	background-image: url(../images/deco/bg_menu_rose.png);
	background-position: center;
}

je ne comprends pas comment attribué le comportement selon la li...

merci

Bonjour...
Tout d'abord je ne comprends pas ceci :

ul#menu_vertical vert a:hover{
background-image:
background-image: url(../images/deco/bg_menu_rose.png);
background-repeat: no-repeat;
background-image: url(../images/deco/bg_menu_rose.png);
background-position: center;
}

Ensuite pourquoi ne pas utiliser : hover/link/visited ou encore active pour définir les caractéristiques de vert, orange et compagnie ?
c'est une idée...

Pour cibler une classe particulière en CSS, il faut la faire précéder d'un point:

ul#menu_vertical [b].[/b]vert a:hover {…}

Au passage, tu gagnerais à utiliser la propriété raccourcie "background" pour ce genre de cas:

background:url(../images/deco/bg_menu_rose.png) no-repeat 50%