вРазные полезности

Зеленое горизонтальное меню фиксация для uCoz

 
Сейчас все больше замечаешь очень редкую гамму сайта, и вот под нее Зеленое горизонтальное меню фиксаций для uCoz под тематический сайт. Первое что бросается, это тема безопасности nod, но по дизайну выполнено обширно в плане, какая основная тематика у вас на ресурсе. Стильно нарисовано и сверстано под игровой портал, но это не важно, так как смотря на его, можно предположить и поставить совершенно на другую тему. В плане эффекта, здесь оригинально все, не так как обычно, что наводишь и рубрика меняет цвет. Тут 2 полосы в форме стрелок по обоим сторонам, вверх и низ и они появляются там, куда навели. И как можно заметить, вы прописали название и под каждым в низу есть немного светлого оттенка, и вот когда производите клик, он исчезает. Пока на резиновый каркас здесь не предусмотрено, а так можете покрасить 4 файла и будет подходить как вам нужно.

Каркас:

Код
<ul class=»menu»>  
  <li><a class=»first» href=»http://zornet.ru/»>Главная</a></li>  
  <li><a href=»/»>Скрипты uCoz</a></li>  
  <li><a href=»/»>ZORNET.RU</a></li>  
<li><a href=»/»>Блог uCoz</a></li>  
  <li><a href=»/»>Шаблоны сайта uCoz</a></li>  
<li><a href=»/»>Все для сайта</a></li>  
  <li><a href=»/»>Дизайн сайта uCoz</a></li>  
<li><a href=»/»>Связь админа</a></li>  

  </ul>

CSS:

Код
ul.menu list-style:none;padding:0;margin:0;width:1041px;height:36px;line-height:300%;font-weight:600;background:url(‘http://zornet.ru/CSS-ZORNET/ZER-1/ZR/back.jpg’);font-size:12px; font-family:Tahoma;  

ul.menu li float:left;position:relative;height:36px;background:url(‘http://zornet.ru/CSS-ZORNET/ZER-1/ZR/separator.png’) top right no-repeat;
ul.menu li a background:url(‘http://zornet.ru/CSS-ZORNET/ZER-1/ZR/href.png’) top center no-repeat;color:#F0FF96;text-decoration:none;display:block;height:36px;padding:0 11px;margin-right:3px;overflow:hidden;text-shadow:0 1px 1px #000;
ul.menu li a.first background:none;
ul.menu li a:hover background:url(‘http://zornet.ru/CSS-ZORNET/ZER-1/ZR/hover.png’) top center no-repeat;

Если вам нужен синея навигация, то здесь можете посмотреть.

источник: zornet.ru

Похожие посты