|
Главная » 2011 » Июль » 29 » Горизонтальное меню с использованием css
11:37 Горизонтальное меню с использованием css |
1. Этот код вставляем туда где вам нужно меню: Code <ul> <li><a href="/" title="Главная"><span>Главная</span></a></li> <li><a href="/news" title="Новости"><span>Новости</span></a></li> <li><a href="/publ" title="Статьи"><span>Статьи</span></a></li> <li><a href="/load" title="Файлы"><span>Каталог файлов</span></a></li> <li><a href="/forum" title="Форум"><span>Форум</span></a></li> </ul>
Ссылки разумеется можно менять на свои.
2. Следующий код вставляем в CSS (ПУ ---> Управление дизайном ---> Таблица стилей CSS): Code ul { font-family: Georgia; list-style-type: none; font-size: 14px; color: #fff; height: 50px; width: 510px; margin: 0 auto; padding-top: 15px; } ul li { float: left; padding: 1px; text-align: center; } ul li a { float: left; display: block; background: #0094D6; text-decoration: none; color: #fff; position: relative; } ul li a:hover { background: #FF7700; z-index: 10; margin: 0 -10px; top: -10px; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; } ul li a span { float: left; display: block; padding: 10px 0; text-decoration: none; color: #fff; width: 100px; cursor: pointer; } ul li a:hover span { width: 120px; padding: 20px 0; }
|
Категория: Скрипты uCoz |
Просмотров: 545 |
Добавил: Jaguar
| Теги: css, простое меню, uCoz, меню, юкоз
| Рейтинг: 0.0/0 |
Добавлять комментарии могут только зарегистрированные пользователи. [ Регистрация | Вход ]
|
|
» Статистика |
Онлайн всего: 1 Гостей: 1 Пользователей: 0 |
|