» »

Вертикальное меню Freskat для сайта uCoz


Вертикальное меню Freskat для сайта uCoz

Это очень распространенное по своему дизайну и функциям Вертикальное меню Freskat для сайта uCoz, которое устанавливается на темный дизайн или фон сайта. Немного его перекрасил, так как это было чисто черное, что здесь представлено оно в этой гамме. Характеристика у него проста, такая же как у основных навигаций, идет одна ссылка на картинку, которая при наведение будет немного изменятся, для того, чтоб было удобно пользователям видно, с какой категорий они выходят или хотят зайти. Первое что делаем, жто ставим код в бог ресурса.

Код
<ul class="bnav">  
<li><a href="/" title="Главная страница">Главная</a> </li>  
  <li><a href="/load" title="Каталог файлов">Файлы</a> </li>  
<li><a href="/" title="Главная страница">Статья</a> </li>  
  <li><a href="/load" title="Каталог файлов">Блоггер</a> </li>  
  <li><a href="/" title="">ZORNET.Ru</a> </li>  
  <li><a href="/load" title="Каталог файлов">Файловый архив</a> </li>  
  <li><a href="http://zornet.ru/" title="Лучший сайт">Администрация на связи</a> </li>  
  </ul>


Потом для него стили пропишем в CSS.

Код
.bnav {width:185px; margin:0px; padding:0px; list-style:none; font-family: Tahoma;border-top:1px solid #484747;border-bottom:1px solid #484747;}  
  .bnav li {height:20px; display:block; background:url(http://zornet.ru/CSS-ZORNET/Grety/hover-csomsk1.png) no-repeat 0 0;text-indent:10px;font-size:11px;}  
  .bnav li:hover {background-position:0 -21px;}  
  .bnav li:hover a:link,  
  .bnav li:hover a:active,  
  .bnav li:hover a:visited {color:#dedede;text-shadow:0 0 3px #313131;padding-top:3;}  
  .bnav li:first-child {border:0;}  
  .bnav li a:link,  
  .bnav li a:active,  
  .bnav li a:visited {height:22px; display:block; color:#b5b5b5;padding-top:3;}  
  .bnav li a:hover {text-decoration:none; text-shadow:0 0 3px #313131;}


На этом все и остается только посмотреть в реале как оно играет цветами.



Источник: http://diz-cs.ru/
27.04.2015 Просмотров: 551 Комментарий: (1)

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

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

Комментарий: 1
Kosten
Kosten 27.04.2015 18:371
0
Это меню с темного перекрашенное.
avatar