Навигатор

Шаблоны для Joomla
Шаблоны для uCoz
Категории раздела
Профиль для ucoz [9]
Новый профиль для ucoz, мини профиль для ucoz, скрипт для ucoz профиль, профиль для сайта ucoz
Ajax для ucoz [13]
Ucoz ajax, ajax окна для ucoz, скрипты ajax для ucoz, новые ajax окна для ucoz, новый вид ajax ucoz
Скрипты для ucoz [128]
скачать скрипты для ucoz, скрипты ucoz
Меню для ucoz [45]
меню для ucoz, горизонтальное меню для ucoz, раздвижное меню ucoz, вертикальное, выпадающие меню ucoz
Календари для ucoz [20]
скрипт календарь cs, скрипт для ucoz календарь, календарь для ucoz cs 1.6, календари ucoz
Часы для ucoz [31]
часы для ucoz, часы для ucoz cs 1.6
Статистика для ucoz [11]
статистика cs для ucoz
Форма входа для ucoz [15]
форма входа для ucoz
Переключатели для ucoz [9]
Переключатели страниц для ucoz
Шапки для ucoz [13]
шапки для ucoz cs 1.6
Интересное
Мини профиль + Форма входа
Рейтинг: 66782
Красивое горизонтальное меню для ucoz
Рейтинг: 54064
Мини-чат для ucoz
Рейтинг: 48510
Скрипт мониторинга cs серверов
Рейтинг: 43544
Слайдер новостей для uCoz
Рейтинг: 18600

Горизонтальное меню ucoz

Горизонтальное меню ucoz


Простое горизонтальное меню ucoz с использованием картинок, картинки очень мало весять, поэтому сайт не будут грузить. Меню без пафоса и подойдет на любой сайт.

Шаг-1 Установка CSS

Заходим в П.У - Дизайн - Упр. Дизайном(CSS) и в самый низ вставляем код:

Code
body {font: 11px Arial, Helvetica, sans-serif;  
  }
#menu {font: 11px Arial, Helvetica, sans-serif;
  background-image:url('http://wallaby.ucoz.ru/menu/bc_bg.png');  
  background-repeat:repeat-x;
  height:30px;
  line-height:30px;
  color:#9b9b9b;
  border:solid 1px #cacaca;
  width:100%;
  overflow:hidden;
  margin:0px;
  padding:0px;
  }
  #menu li {list-style-type:none;
  float:left;
  padding-left:10px;
  }
  #menu a {height:30px;
  display:block;
  background-image:url('https://wallaby.ucoz.ru/menu/bc_separator.png');  
  background-repeat:no-repeat;  
  background-position:right;
  padding-right: 15px;
  text-decoration: none;
  color:#454545;
  }
  .home {border:none;
  margin: 8px 0px;
  }
#menu a:hover{color: gray;
  }
Шаг-2 Установка HTML

Вставляем туда, где вы хотите видеть горизонтальное меню:

Code
<ul id="menu">  
<li><a href="" title="Главная"><img src="http://wallaby.ucoz.ru/menu/home.png" alt="Home" class="home" /></a></li>  
<li><a href="" title="Форум поддержки">Форум поддержки</a></li>  
<li><a href="" title="Блог">Блог</a></li>  
<li><a href="" title="Товары">Товары</a></li>  
<li><a href="" title="О нас">О нас</a></li>  
</ul>
Категория Меню для ucoz | Добавил: skyrim1989 | Просмотров: 8299 |

Комментарии отсутствуют

по актуальности
Чтобы оставить комментарий, необходимо или