Регистрация    Войти
Авторизация

Красивая навигация в web стиле с иконками для ucoz

Красивая навигация в web стиле с иконками для ucoz.

Красивая навигация для сайта с иконками, выполненная очень качественно и аккуратно.В данном меню слева расположена к каждому пункту меню своя тематическая иконка. В обычном режиме меню светлое, а при наведении курсором становится ярко зеленым. Данная навигация непо впишется в светлый дизайн.


В блок где хотите видеть меню:
<nav class="bnav"> 
<ul>
<li><a href="/"><span class="ico ico_01"></span>Главная</a></li>
<li><a href="/load/"><span class="ico ico_02"></span>Фильмы торрент</a></li>
<li><a href="/load/"><span class="ico ico_03"></span>Сериалы торрент</a></li>
<li><a href="/load/"><span class="ico ico_04"></span>ТВ передачи торрент</a></li>
<li><a href="/load/"><span class="ico ico_05"></span>Мультфильмы торрент</a></li>
<li><a href="/load/"><span class="ico ico_06"></span>Музыка торрент</a></li>
<li><a href="/load/"><span class="ico ico_07"></span>Игры торрент</a></li>
<li><a href="http://manucoz.ru/"><span class="ico ico_08"></span>Шаблоны для uCoz</a></li>
<li><a href="/load/"><span class="ico ico_09"></span>Журналы торрент</a></li>
<li><a href="/load/"><span class="ico ico_10"></span>Спорт торрент</a></li>
<li><a href="/load/"><span class="ico ico_11"></span>Обои торрент</a></li>
</ul>
</nav>


В CSS:
.bnav {width:215px;} 
.bnav li {margin:3px 0 0 0;}
.bnav li:first-child {margin:0;}
.bnav li a {height:30px; padding:0 0 0 36px; display:block; position:relative; overflow:hidden; font:12px/30px Calibri; color:#4e6378; text-shadow:0 1px 1px #f5f8fa; text-decoration:none; background:url(http://ucozup.ru/files_ucozup/block_bg.png) no-repeat -698px 0;}
.bnav li a:hover {color:#fff; text-shadow:0 1px 1px #329500; background-position:-698px -32px;}
.bnav li a .ico {width:24px; height:24px; display:block; position:absolute; left:6px; top:3px; background-image:url(http://ucozup.ru/files_ucozup/icon_block.png); background-repeat:no-repeat;}
.bnav li a .ico_01 {background-position:center 3px;}
.bnav li a .ico_02 {background-position:center -28px;}
.bnav li a .ico_03 {background-position:center -60px;}
.bnav li a .ico_04 {background-position:center -94px;}
.bnav li a .ico_05 {background-position:center -128px;}
.bnav li a .ico_06 {background-position:center -160px;}
.bnav li a .ico_07 {background-position:center -194px;}
.bnav li a .ico_08 {background-position:center -228px;}
.bnav li a .ico_09 {background-position:center -260px;}
.bnav li a .ico_10 {background-position:center -293px;}
.bnav li a .ico_11 {background-position:center -228px;}


Вот и все ваше меню для uCoz готово)

Есть вопросы по шаблону или скрипту? так задай их и мы ответим!

Автор: chestr  2-01-2014, 14:08   Просмотров: 4578   
Красивая навигация, Красивая навигация ucoz, Красивая навигация в web стиле, Другие, иконками, Красивая, Web, стиле, навигация
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо зайти на сайт под своим именем.

Пользователь offline -SAM- 10 февраля 2014 00:03
Ну и кому нужен сам шаблон, то вот - http://manucoz.ru/ucoz/shablony_ucoz/internet-shablony-ucoz/3373-shablon-dlya-uc
oz-torrentiki.html / http://manucoz.ru/ucoz/shablony_ucoz/internet-shablony-ucoz/3444-shablon-dlya-uc
oz-u-torrentino.html

          1

Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.