Главная » Файлы » Скрипты для uCoz » Меню
Горизонтальное меню Кнопками для uCoz
21.06.14, 15:55:02

Скачать файл



Установка:

Заливаем содержимое архива в корень сайта

На странице, где хотим видеть меню между:
Код
<head> и </head>


Вставляем:
Код
<style type="text/css">
  /* --------------------------
  AUTHOR : ST1M
  Copyrights by ST1M
  ----------------------------*/
  *{
  margin:0;
  padding:0;
  }
  body{
  background:#fff;
  color:#666;
  font:12px/18px Tahoma, Arial, Helvetica, sans-serif;
  }
  #menu{
  width:700px;
  }
  #menu ul{
  list-style:none;
  }
  #menu li{
  list-style:none;
  display:block;
  float:left;
  margin:0 1px;
  }
  #menu li a{
  display:block;
  float:left;
  height:52px;
  color:#0e7b93;
  text-transform:uppercase;
  font-size:11px;
  font-weight:bold;
  background:url(/images/menu_027_l.jpg) no-repeat left;
  line-height:39px;
  padding:0 0 0 18px;
  text-decoration:none;
  }
  #menu li a span{
  display:block;
  float:left;
  background:url(/images/menu_027_r.jpg) no-repeat right;
  height:52px;
  color:#0e7b93;
  line-height:39px;
  padding:0 36px 0 17px;
  }
  #menu li a:hover{
  display:block;
  float:left;
  background:url(/images/menu_027_h_l.jpg) no-repeat left;
  height:52px;
  }
  #menu li a:hover span{
  display:block;
  float:left;
  background:url(/images/menu_027_h_r.jpg) no-repeat right;
  color:#7c832d;
  height:52px;
  }
  #menu li a.current{
  display:block;
  float:left;
  height:52px;
  color:#7c832d;
  text-transform:uppercase;
  font-size:11px;
  font-weight:bold;
  background:url(/images/menu_027_h_l.jpg) no-repeat left;
  line-height:39px;
  padding:0 0 0 18px;
  text-decoration:none;
  }
  #menu li a.current span{
  display:block;
  float:left;
  background:url(/images/menu_027_h_r.jpg) no-repeat right;
  height:52px;
  color:#7c832d;
  line-height:39px;
  padding:0 36px 0 17px;
  }</style>


Далее код вставляем туда, где хотим видеть само меню:
Код
<div id="menu">
  <ul>
  <li><a href="Ссылка" class="current"><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>
  <li><a href="Ссылка"><span>Имя</span></a></li>
  </ul>
  </div>


Всё! smile
Категория: Меню | Добавил: Apocalypse | Теги: Кнопками, горизонтальное, ucoz, для, Меню
Просмотров: 371 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: