Установка:
1. Копируем код, и вставляем между <head> и </head>
Code
<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>
2. Вставляем этот код в любое место
Code
<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>
