Каталог файлов

Главная » Файлы » Меню » Вертикальное

Вертикальное меню на CSS 3


Вставьте туда, где будет ваше меню:
Код
<a href="#" class="menu_test_123">Текст меню1</a>  
<a href="#" class="menu_test_123">Текст меню2</a>  
<a href="#" class="menu_test_123">Текст меню3</a>  
<a href="#" class="menu_test_123">Текст меню4</a>  
<a href="#" class="menu_test_123">Текст меню5</a>
Вставьте в таблицу стилей CSS:
Код
.menu_test_123 {
width: 100%;
text-deroration: none;
font-size: 9pt;
background: #D1D1D1;
padding: 6px;
display: block;
background: -moz-linear-gradient(0% 100% 90deg, #F2F2F2, #D7D7D7);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2),  
to(#D7D7D7));
background: linear-gradient(#F2F2F2,#D7D7D7);
border-radius: 4px;
box-shadow: 0 0 3px #000000;  
margin: 3px 1px;
font-weight: bold;}
a.menu_test_123:link {color: #535353; text-decoration: none;}
a.menu_test_123:visited {color: #535353;text-decoration: none;}
a.menu_test_123:active {color: #535353; text-decoration: none; box-shadow: inset 1px 1px 5px #A4A4A4;
background: -moz-linear-gradient(0% 100% 90deg, #F2F2F2, #D7D7D7);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2), to(#D7D7D7));
background: linear-gradient(#F2F2F2,#D7D7D7);
}
a.menu_test_123:hover {color: #535353; text-decoration: none; background: #B9B9B9;
background: -moz-linear-gradient(0% 100% 90deg, #F2F2F2, #BFBFBF);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F2F2F2), to(#BFBFBF));
  background: linear-gradient(#F2F2F2,#BFBFBF);}


Поддержка браузеров   

Категория: | | 641 | 0 | Дата: 29/07/2026
Всего комментариев: 0
Имя *:
Email:



Код *:

Copyright MyCorp © 2012-2026