Меню сайта
  • Главная страница
  • Форум
  • Скрипты для ucoz
  • Шаблоны для ucoz
  • Иконки и кнопки
  • Все для веб мастера
  • Другое для ucoz
  • Каталог статей
 
Категории
Скрипты для Ucoz [92]
Шаблоны для Ucoz [90]
Иконки и Кнопки [46]
Софт Веб Мастеру [14]
Другое [14]
 
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
 
Главная » Файлы » Скрипты для Ucoz

Вертикальное меню css
  05.10.2009, 16:29

Установка:

Управление сайтом--Управление дизайном--Таблица стилей (CSS)

и в самом низу прописываем данные код.

Code
/*  
=============================================================  
© 2009 Warez every day  
http://2all4you.ru  
=============================================================  
*/  

ul#menu {  
  margin: 0px; /* Отступ для кнопок */  
  list-style-type : none;  
  font-size: 10px; /* Размер шрифта в кнопках */  
}  

ul#menu li {  
  margin-bottom: 3px; /* Отступ между кнопками */  
}  

ul#menu a {  
  position: relative;  
  width: 130px; /* Ширина кнопки */  
  height: 2em; /* Высота кнопки */  
  display: block; /* Отображение кнопок (НЕ МЕНЯТЬ) */  
  padding: 3px; /* Отступ для текста в кнопках */  
  padding-right: 0; /* Правый отступ для кнопок */  
  border: 1px solid #002948; /* Задание границы кнопки */  
  background-color: #c4e5ff; /* Задание фона кнопки */  
  color: #000; /* Цвет шрифта в кнопках */  
  text-decoration: none; /* Отмена подчёркивания ссылок */  
  font-weight: bold; /* Полужирный шрифт */  
  cursor: pointer; /* Задание типа курсора */  
}  

ul#menu a span {  
  position: absolute; /* Задание позиции подсказок (НЕ МЕНЯТЬ) */  
  top: -10000px; /* Задание позиции подсказок (НЕ МЕНЯТЬ) */  
  left: -10000px;/* Задание позиции подсказок (НЕ МЕНЯТЬ) */  
  display: block; /* Отображение подсказок (НЕ МЕНЯТЬ) */  
  width: 100%; /* Длинна поля подсказок */  
  height: 2em; /* Задание высоты поля подсказок */  
  background-color: #c4e5ff; /* Задание фона поля подсказок */  
  border: 1px solid #002948; /* Задание границы поля подсказок */  
  border-left: 0; /* Отключение левой границы */  
  padding: 3px; /* Отступ для текста подсказки */  
  padding-left: 20px; /* Отступ для текста подсказки */  
  cursor: pointer; /* Задание типа курсора */  
  color: #333; /* Цвет шрифта в подсказках */  
}  

ul#menu a:hover, ul#cmd a:focus, ul#cmd a:active {  
  background: #c4e5ff; /* Задание фона подсказки */  
}  

ul#menu a:hover span, ul#cmd a:focus span, ul#cmd a:active span {  
  top : -1px; /* Задание поля подсказки (НЕ МЕНЯТЬ) */  
  left : 80px; /* Задание поля подсказки (НЕ МЕНЯТЬ) */  
}  

/* ====== Copyright by http://2all4you.ru ====== */

Далее

В нужном месте вставляем наше будущие меню с пояснениями
Тут нужно редактировать под себя:

Code
<ul id="menu">  
  <li><a href="Ссылка"><strong>Главная</strong>  
  <span>→ Главная страница сайта</span></a></li>  
<li><a href="Ссылка"><strong>Форум</strong>  
  <span>→ Наш форум сайта</span></a></li>  
<li><a href="#"><strong>Гостевая</strong>  
  <span>→ Оставить мнение о сайте</span></a></li>  
  <li><a href="#"><strong>Гостевая</strong>  
  <span>→ Оставить мнение о сайте</span></a></li>  
  <li><a href="#"><strong>Гостевая</strong>  
  <span>→ Оставить мнение о сайте</span></a></li>  
  <li><a href="#"><strong>Гостевая</strong>  
  <span>→ Оставить мнение о сайте</span></a></li>  
</ul>



Источник: http://2all4you.ru

Категория : Скрипты для Ucoz | Добавил : Anasy | Теги : Вертикальное меню css
Просмотров : 419 | Загрузок : 0 | Рейтинг : 0.0/0
Всего комментариев : 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Мини профиль

 
Поиск
 
Новое на форуме
 
Друзья сайта
Всё для Ucoz. Шаблоны, Скрипты, Кнопки, Иконки. Софт для Web Mastera.
 
Design by Anasy. Все материалы предназначены исключительно для ознакомления!
Хостинг от uCoz