Вертикальное меню 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/ |
Поделиться в социальных сетях
Материал разместил
Комментарии: 1 | |
| |