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