Вертикальное меню ховер красный
Минюшка вертикальная с ховер красным эффектом
Используется отлично для серых дизайнов, с ярким красным цветом
Установка:
1.Вставляете код в г. блок
Code
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr align="left"><td><a href="ссылка" title="Главная" class="mainlevel" id="active_menu">Главная</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Новости" class="mainlevel" >Новости</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Помощь новичкам" class="mainlevel" >Помощь новичкам</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Демки" class="mainlevel" >Демки</a></td></tr>
<tr align="left"><td><a href="ссылка" title="POV Демки" class="mainlevel" >POV Демки</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Обучающие Демки" class="mainlevel" >Обучающие Демки</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Файлы" class="mainlevel" >Файлы</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Статьи" class="mainlevel" >Статьи</a></td></tr>
<tr align="left"><td><a href="ссылка" title="FAQ по CS" class="mainlevel" >FAQ по CS</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Конфиги" class="mainlevel" >Конфиги</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Логотипы" class="mainlevel" >Логотипы</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Установка CS" class="mainlevel" >Установка CS</a></td></tr>
<tr align="left"><td><a href="ссылка" title="CS сервера" class="mainlevel" >CS сервера</a></td></tr>
<tr align="left"><td><a href="ссылка" title="Наши кнопки" class="mainlevel" >Наши кнопки</a></td></tr>
<tr align="left"><td><a href="ссылка" title="FAQ по сайту" class="mainlevel" >FAQ по сайту</a></td></tr>
</table>
В таблицу стилей
Code
a.mainlevel:link, a.mainlevel:visited {
display : block;
width : 186px;
line-height : 21px;
font-size : 11px;
color : #eee;
text-decoration : none;
font-weight : bold;
background : url(http://ucozon.ru/SCRIN7/1/ico/01/ianus_modulbutton.gif) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
} a.mainlevel:hover {
color : #FFFF99;
text-indent : 30px;
background-position : 0 -23px;
text-decoration : none;
}
a.mainlevel#active_menu {
color : #333;
background-position : 0 -46px;
}
a.sublevel:link, a.sublevel:visited {
display : block;
width : 181px;
line-height : 21px;
font-size : 11px;
color : #eee;
text-decoration : none;
font-weight : bold;
background : url(http://ucozon.ru/SCRIN7/1/ico/01/ianus_modulsubbutton.gif) no-repeat;
text-indent : 24px;
padding-bottom : 2px;
}
a.sublevel:hover {
color : #05b8f4;
text-indent : 30px;
background-position : 0 -23px;
text-decoration : none;
}
a.sublevel#active_menu {
color : #333;
background-position : 0 -46px;
}
a.mainlevel-nav:link, a.mainlevel-nav:visited {
float : left;
display : block;
line-height : 19px;
font-size : 11px;
color : #ddd;
text-decoration : none;
font-weight : bold;
background : url(http://ucozon.ru/SCRIN7/1/ico/01/ianus_topbutton.gif) repeat-x;
padding : 0px 10px 0px 10px;
border-right : 1px solid #777;
border-left : 1px solid #555;
vertical-align : top;
}
a.mainlevel-nav:hover {
color : #fff;
background-position : 0 -19px;
text-decoration : none;
}
a.mainlevel-nav#active_menu-nav {
color : #333;
background-position : 0 -38px;
text-decoration : none;
}