» »

Простое, но красивое меню на сайт uCoz

Простое, но красивое меню на сайт uCoz

Очень простое, светлое меню. Меню не имеет ограничения по ширине. Лёгкое, не подгружает сайт, можно легко перенастроить, не сложный код. Это меню по сути старое и кто ставит на сайт шаблон PDA, то здесь его можно поставить. Просто оно на ссылках и его дизайн, но смотрится безусловно красиво и отлично должно подойти на интернет ресурс у которого ширина как можно фиксированная, а это тематика блог.

Html код меню:

Код
<div class="h_v_m">  
  <ul>  
  <li><a href="http://zornet.ru/"><span>Главная страница</span></a></li>  
  <li><a href="#"><span>Форум</span></a></li>  
  <li><a href="#"><span>Новости портала</span></a></li>  
  <li><a href="#"><span>Топ сайтов</span></a></li>  
  </ul>  
</div>


Style:

Код
/* Css */  
.h_v_m { margin: 0 0px 0 0; height: 41px; background: url(/img/1.png) repeat-x;}  
.h_v_m ul { list-style:none; float:left; }  
.h_v_m ul li { display:inline; margin: 0 auto; height: 41px; float:left; background: url(/img/2.png) no-repeat top right; padding-top:8px;}  
.h_v_m ul li a {line-height:27px;}  
.h_v_m a span,  
.h_v_m a {text-decoration: none;font-family: Tahoma; float: left; height: 27px; text-transform: none; font-size: 11px; }  
.h_v_m a { color: #2980a2; display: block; margin-left: 12px; margin-right: 13px; line-height: 27px; padding: 0px 0px 0px 15px; }  
.h_v_m a span { color: #2980a2; float: left; background-position: 100% -27px; line-height: 24px; padding: 0px 17px 0px 0px; }  
.h_v_m a:hover { background: url(/img/3.png) no-repeat 0 0;height: 27px; text-decoration:none; }  
.h_v_m a:hover span { color: #ffffff; background: url(/img/3.png) no-repeat 100% -27px; }  
/*********/
15.03.2017 Загрузок: 5 Просмотров: 505 Комментарий: (3)

Поделиться в социальных сетях

Материал разместил

Комментарий: 3
Kolinkor
Kolinkor 16.03.2017 00:131
0
Не очень, сейчас такой материал стал не актуален, стили рулят.
Scheme
Scheme 16.03.2017 12:492
0
Приветствую тебя прошлое столетие, но не чего не могу сказать при виде этого материала.
Kosten
Kosten 16.03.2017 13:383
0
По мне может еще быть актуальным, потому и оставил.
avatar