как сделать горизонатльное 2-ух уровневое меню @ DeForum.ru
DeДверь  
Логин:  
Пароль:  
  Автологин  
   
Разместить рекламу
Письмо админу
Правила | FAQ | *Поиск | Наша команда | Регистрация | Вход
 
 
 Страница 1 из 1 [ Сообщений: 6 ] 
*   Список форумов / Начинка и техника / Программирование для WWW » ответить » создать топик « | »
Автор Сообщение
sergeylandar
новый человек
24
Сообщения: 47
Зарегистрирован: 19.10.05
Откуда: Ukraine
Заголовок сообщения: как сделать горизонатльное 2-ух уровневое меню
Сообщение Добавлено: 10 Октябрь 2007, 16:42:18 
привет
хочу сделать горизонтальное меню на div -ах

вот что имею в html
<div class="menu-main-horizontal-panel">
<ul>

<li class="">
<a href="">Home</a>
</li>
<li class="">
<a href="">Account</a>
</li>
<li class="">
<a href="">Permissions</a>

</li>
<li class="active">
<span>User support</span>
<ul>
<li class="">
<a href="">Support</a>
</li>
<li class="">

<a href="">Register member</a>
</li>
<li class="">
<a href="">Register merchant</a>
</li>
<li class="">
<a href="">Register station</a>

</li>
</ul>
</li>
<li class="">
<a href="">Manage budgets</a>
</li>
<li class="">
<a href="">Award Codes</a>

</li>
<li class="">
<a href="">Insertion Orders</a>
</li>
<li class="">
<a href="">Terms and Conditions</a>
</li>
<li class="">

<a href="">Logout</a>
</li>
</ul>
</div>

тоесть в браузере должно быть первая линия меню и вторая линия типа под меню

может кто делал такое, подскажите плз, или дайте юрл на пример

пасибки!
hardy Муж.
новый человек
2
Сообщения: 114
Зарегистрирован: 05.02.04
Откуда: Харьков, Украина
Сообщение Добавлено: 10 Октябрь 2007, 18:39:08 
и что? одноуровневое делать умеешь? второй уровень делаешь абсолютом, относительно родительского списка.

_________________
режу PSD в HTML
ICQ: 348215379
e-mail: sbaidin(собака)gmail.com
hardy Муж.
новый человек
2
Сообщения: 114
Зарегистрирован: 05.02.04
Откуда: Харьков, Украина
Сообщение Добавлено: 10 Октябрь 2007, 18:48:40 
<ul id="menu">
<li><a href="#">About Us</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Pricing</a>
<ul>
<li><a href="#">Weddings &amp; Brides</a></li>
<li><a href="#">Engagements</a></li>
<li><a href="#">Families</a></li>
<li><a href="#">Seniors &amp; Children</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Prints &amp; Albums</a></li>
</ul>
</li>
<li><a href="#">Client Reviews</a></li>
<li><a href="#">Articles &amp; Advice</a></li>
<li id="last"><a href="#">Client Tools</a></li>
</ul>


#menu {
float: right;
margin: 0;
padding: 0;
height: 59px;
position: relative;
overflow: hidden;
}
#menu a:hover {
color: #fff;
}
#menu li {
float: left;
list-style: none;
background: url('../images/bg_menu.gif') repeat-x;
border-right: 2px solid #000;
height: 36px;
}
#menu li#last {
border-right: none;
}
#menu li a {
display: block;
float: left;
text-decoration: none;
line-height: 34px;
font-weight: bold;
padding: 0 17px;
}
#menu li ul {
display: none;
position: absolute;
top: 35px;
left: 0;
padding: 0 0 0 25px;
margin: 0;
background: #900000;
width: 1000px;
}
#menu li:hover,
#menu li.hover {
background: #9A0000 url('../images/bg_menu_hover.gif') repeat-x;
border-bottom-color: #900000;
}
#menu li ul li:hover,
#menu li ul li.hover {
background: none;
}
#menu li:hover ul,
#menu li.hover ul {
display: block;
}
#menu li ul li {
border: none;
background: none;
padding: 0 15px;
height: 23px;
}
#menu li ul li a {
height: 23px;
display: inline;
font: normal 11px Tahoma, Arial, sans-serif;
line-height: 23px;
padding: 0;
}

_________________
режу PSD в HTML
ICQ: 348215379
e-mail: sbaidin(собака)gmail.com
Алефъ Муж.
постоянный участник
20
Сообщения: 2579
Зарегистрирован: 07.08.07
Сообщение Добавлено: 10 Октябрь 2007, 19:08:53 
Спасибо вам добрые люди за красоту оформления кода. Думал, у меня комп сломался.
sergeylandar
новый человек
24
Сообщения: 47
Зарегистрирован: 19.10.05
Откуда: Ukraine
Сообщение Добавлено: 10 Октябрь 2007, 19:20:29 
#menu li ul li { << это нормальная практика? так можно делать?
tentoys Муж.
постоянный участник
121
Сообщения: 2940
Зарегистрирован: 06.08.02
Откуда: МКАДонутряк
Сообщение Добавлено: 10 Октябрь 2007, 19:27:23 
sergeylandar, а почему нет.
в css свойства элемента списка (li), принадлежащего маркированному списку (ul), который в свою очередь принадлежит элементу списка (li) и всё это принадлежит элементу с идентификатором menu.

_________________
Keep in touch. Andrey Alexeev.
*   Список форумов / Начинка и техника / Программирование для WWW « | » » ответить » создать топик
 Страница 1 из 1 [ Сообщений: 6 ] 
Показать сообщения за:   Поле сортировки  
Найти:
Перейти:  
Уровень доступа: Вы не можете начинать темы. Вы не можете отвечать на сообщения. Вы не можете редактировать свои сообщения. Вы не можете удалять свои сообщения. Вы не можете добавлять вложения.
cron


ООО ДеФорум
При использовании материалов сайта ссылка на DeForum.ru — обязательна.
Проект Павла Батурина ©2001-2077; // Powered by phpBB © 2013 phpBB Group
Rambler's Top100