<style type="text/css">    
*{    
margin:0;    
padding:0;    
}    
body{    
background:#fff;    
color:#666;    
font:12px/18px Tahoma, Arial, Helvetica, sans-serif;    
}    
#menu{    
background:#fff;    
width:170px;    
}    
#menu ul{    
list-style:none;    
}    
#menu li{    
list-style:none;    
margin:2px 0;    
}    
#menu li a{    
list-style:none;    
background:#82837c;    
color:#fff;    
text-transform:uppercase;    
font-size:11px;    
font-weight:bold;    
text-decoration:none;    
border:solid #777776;    
border-width:0 6px 0 6px;    
display:block;    
height:30px;    
line-height:30px;    
padding:0 0 0 10px;    
}    
#menu li a:hover{    
background:#777776;    
color:#fff;    
text-decoration:none;    
}    
#menu li a.green{    
background:#83ad3e;    
border:solid #6f9234;    
border-width:0 6px 0 6px;    
}    
#menu li a:hover.green{    
background:#6f9234;    
}    
#menu li a.blue{    
background:#4396bd;    
border:solid #377e9f;    
border-width:0 6px 0 6px;    
}    
#menu li a:hover.blue{    
background:#377e9f;    
}    
#menu li a.orange{    
background:#ff7327;    
border:solid #d65611;    
border-width:0 6px 0 6px;    
}    
#menu li a:hover.orange{    
background:#d65611;    
}    
#menu li a.brn{    
background:#a53cbe;    
border:solid #87249f;    
border-width:0 6px 0 6px;    
}    
#menu li a:hover.brn{    
background:#87249f;    
}</style>

<div id="menu">    
<ul>    
<li><a href="ссылка">Название</a></li>    
<li><a href="ссылка" class="green">Название</a></li>    
<li><a href="ссылка" class="blue">Название</a></li>    
<li><a href="ссылка" class="orange">Название</a></li>    
<li><a href="ссылка" class="brn">Название</a></li>    
</ul>    
</div>