|
|
Регистрация Восстановить пароль |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
|
Опции темы | Поиск в этой теме |
08.07.2012, 18:40 | #21 |
Новичок
Джуниор
Регистрация: 08.07.2012
Сообщений: 12
|
Сильно извиняюсь, но сегодня я уже не смогу этим заняться. Если вы сами не сможете это исправить, то я это сделаю только завтра.
|
08.07.2012, 18:44 | #22 |
Пользователь
Регистрация: 15.01.2012
Сообщений: 52
|
serken, хорошо. Вот кстати, если будете завтра заниматься. Сразу уже измененные мною коды:
HTML: Код HTML:
<div id="menu"> <ul class="nav"> <li><a href="/">Новости</a></li> <li><a href="/forum/">Форум</a></li> <li><a href="/load/">Загрузки</a></li> <li><a href="/ships/">Корабли</a> <ul class="anchor"> <li><a href="\">Первый подпункт</a></li> <li><a href="\">Второй подпункт</a></li> </ul> </li> <li><a href="/video/">Видео</a></li> <li><a href="/images/">Изображения</a></li> <li><a href="/stories/">Истории</a> <ul class="anchor"> <li><a href="\">Первый подпункт</a></li> <li><a href="\">Второй подпункт</a></li> </ul> </li> <li><a href="./index.php?do=feedback">Обратная связь</a></li> </ul> </div> Код HTML:
*{margin: 0; padding: 0; text-align: center;} #menu .nav { position: relative; font-family: Times New Roman; font-size: 16px; border-bottom:2px solid #FFFFFF; border-top:2px solid #FFFFFF; height:20px; padding: 10px; margin-top: 25px; background: url('bg.png'); -webkit-box-shadow: 0px 0px 50px #000000; /* Safari, Chrome */ -moz-box-shadow: 0px 0px 50px #000000; /* Firefox */ box-shadow: 0px 0px 50px #000000; text-align: center;} #menu .anchor {position: absolute; top: 30px; display: none; background: url('bg.png'); padding: 10px; padding-left: 2px;border-top:2px solid #FFFFFF; text-align: center;} #menu .anchor li{ width: 100px; position: relative; } /*Пункт вложенного меню*/ #menu .nav li:hover .anchor, .anchor:hover{display: run-in;} /*Наведение на пункт*/ #menu .nav li {float: left; list-style: none; position: relative;} /*Все пункты главного списка*/ #menu .nav li .anchor a{margin: 5px; height: 20px;} /*Вложенные ссылки*/ #menu .nav li a { text-decoration: none; display: block; height: 30px; margin: 0 10 0 10; } #menu ul li a:link { color:#bad7fc; } #menu ul li a:visited { color:#bad7fc; } #menu ul li a:hover { color:#84bbff; text-decoration: underline; } |
08.07.2012, 18:44 | #23 |
Пользователь
Регистрация: 15.01.2012
Сообщений: 52
|
Если что-то еще изменю, обязательно напишу в тему обновленные коды.
|
09.07.2012, 07:41 | #24 |
Пользователь
Регистрация: 15.01.2012
Сообщений: 52
|
Вообщем после долгих трудов, я нашел только один, и то временный выход. Создать <div> ограниченной ширины. Но это решение как я уже говорил временное, так что если кто что-либо знает, пишите!
Вот коды: HTML: Код HTML:
<div id="menu"><ul class="nav"><div style="text-align: center; margin: 0 auto; width: 777px;"> <li><a href="/">Новости</a></li> <li><a href="/forum/">Форум</a></li> <li><a href="/load/">Загрузки</a></li> <li><a href="/ships/">Корабли</a> <ul class="anchor"> <li><a href="\">Пассажирские</a></li> <li><a href="\">Военные</a></li> <li><a href="\">Грузовые</a></li> <li><a href="\">Подводные</a></li> </ul> </li> <li><a href="/video/">Видео</a></li> <li><a href="/images/">Изображения</a></li> <li><a href="/stories/">Истории</a> <ul class="anchor"> <li><a href="\">Реальные</a></li> <li><a href="\">Вымышленные</a></li> </ul> </li> <li><a href="./index.php?do=feedback">Обратная связь</a></li> </div></ul></div> Код HTML:
/* МЕНЮ - НАЧАЛО */ *{margin: 0; padding: 0; text-align: center;} #menu .nav { font-family: Times New Roman; font-size: 16px; border-bottom:2px solid #FFFFFF; border-top:2px solid #FFFFFF; height:20px; margin: 0; padding: 10px; margin-top: 25px; background: url('images/bg.png'); -webkit-box-shadow: 0px 0px 50px #000000; /* Safari, Chrome */ -moz-box-shadow: 0px 0px 50px #000000; /* Firefox */ box-shadow: 0px 0px 50px #000000; text-align: center;} #menu .anchor {position: absolute; display: none; background: url('images/bg.png'); padding: 0px 10px 0px 10px; left: -67px; border: 1px solid #FFFFFF;border-top:2px solid #FFFFFF;} #menu .anchor li{ width: 150px; position: relative; text-align: center;} /*Пункт вложенного меню*/ #menu .nav li:hover .anchor, .anchor:hover{display: run-in;} /*Наведение на пункт*/ #menu .nav li {float: left; list-style: none; position: relative; text-align: center;} /*Все пункты главного списка*/ #menu .nav li .anchor a{padding: 5px 0px 5px 0px; height: 20px;} /*Вложенные ссылки*/ #menu .nav li a { text-decoration: none; display: block; height: 30px; margin: 0px 15px 0px 15px; } #menu ul li a:link { color:#bad7fc; } #menu ul li a:visited { color:#bad7fc; } #menu ul li a:hover { color:#84bbff; text-decoration: underline; } /* МЕНЮ - КОНЕЦ */ |
10.07.2012, 10:22 | #25 |
Пользователь
Регистрация: 15.01.2012
Сообщений: 52
|
Кстати, serken, этот код меню почему-то не работает в Firefox и ранних версиях [COLOR="rgb(139, 0, 0)"]IE[/COLOR]... Есть предложения по исправлению?
|
10.07.2012, 11:36 | #26 |
Раздолбайских Дел
Старожил
Регистрация: 22.05.2009
Сообщений: 3,828
|
ff до 4 версии может не воспринимать
Код:
Код:
Alar, верни репу!
|
10.07.2012, 12:44 | #27 |
Пользователь
Регистрация: 15.01.2012
Сообщений: 52
|
Naive, спасибо, работает. А с центрированием не поможете?
|
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Выпадающее меню CSS+HTML | Mat-eria | HTML и CSS | 0 | 17.11.2011 17:29 |
Выпадающее горизонтальное меню на css | st_sasha | HTML и CSS | 1 | 20.10.2011 16:26 |
Css-меню вертикальное выпадающее и раскрывающееся при выборе | Landysh86 | HTML и CSS | 3 | 04.05.2011 13:25 |
горизонтальное меню | s.talke.r | Паскаль, Turbo Pascal, PascalABC.NET | 1 | 18.12.2010 17:12 |
Горизонтальное меню на CSS. | yermolenko | HTML и CSS | 2 | 27.05.2010 10:47 |