Например:
Пятница, 02.12.2022, 18:14 Регистрация Карта сайта RSS Лента
Игровые новости Топ Сайтов Статьи Загрузить изображение Игровой форум Картинки
  • Страница 1 из 1
  • 1
Форум » Система Ucoz » Скрипты Меню » Горизонтальное меню в стиле контакта для Ucoz (Уникальный вид!)
Горизонтальное меню в стиле контакта для Ucoz
Dimas777
Дата: Суббота, 09.08.2014, 19:37 | Сообщение № 1
ICQ пользователя:
Skype пользователя:
Сайт пользователя:

Оффлайн
Сообщений: 300
Награды: 2
 


Уникальное меню использующее только свойства нового CSS.

Установка:

HTML:

Код
<div id="nav">  
   <ul>  
   <li><a href="">Главная</a></li>  
   <li><a href="">Форум</a></li>  
   <li><a href="">Файлы</a></li>  
   <li><a href="">Статьи</a></li>  
   <li><a href="">Контакты</a></li>  
   <li><a href="">Game-Portals.3dn.ru</a></li>  
   </ul>  
   </div>


CSS:

Код
ul, li{margin:0; padding:0; list-style:none; float:left;}   

   #nav{height:40px; display:table;}   
   #nav ul li{background: -moz-linear-gradient(top, rgba(83,107,146,1) 0%, rgba(69,88,120,1) 100%); background: -webkit-linear-gradient(top, rgba(83,107,146,1) 0%,rgba(69,88,120,1) 100%); background: -o-linear-gradient(top, rgba(83,107,146,1) 0%,rgba(69,88,120,1) 100%); box-shadow:inset 0 -2px 0 rgba(0,0,0,0.2);}   
   #nav ul li:hover{background:rgba(64,64,64,1);}   
   #nav ul li:first-child{border-top-left-radius:2px; border-bottom-left-radius:2px;}   
   #nav ul li:last-child{border-top-right-radius:2px; border-bottom-right-radius:2px;}   
   #nav ul li a{line-height:40px; display:block; padding:0 25px; text-decoration:none; text-transform:uppercase; font-weight:bold; color:rgba(255,255,255,1); text-shadow:0 1px 0 rgba(0,0,0,0.2);}


ДЕМО!

Готово! Комментируем.

Горизонтальное, меню, стиле, контакта, для, Ucoz

    
Game-Portals.3dn.ru - The Best.
Форум » Система Ucoz » Скрипты Меню » Горизонтальное меню в стиле контакта для Ucoz (Уникальный вид!)
  • Страница 1 из 1
  • 1
Поиск: