Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 23.04.2011, 02:21   #1
dvuwka
Пользователь
 
Регистрация: 03.03.2011
Сообщений: 14
По умолчанию Выпадающее меню

Какие способы есть сделать выпадающее меню как это,


меня интересуют именно css стили какие нужно применить,
просто в css не силен.

Можно просто объяснить теорию, как сделать чтобы блок который под блоком с надписью "соревнование", располагался точно под ним, но над остальными блоками
dvuwka вне форума Ответить с цитированием
Старый 23.04.2011, 03:22   #2
KREGI
Форумчанин
 
Аватар для KREGI
 
Регистрация: 29.11.2008
Сообщений: 333
По умолчанию

как вариант вот так
Код HTML:
<ul>
    <li><a href="#">link 1</a>
          <ul>
               <li><a href="#">sublink 1</a></li>
               <li><a href="#">sublink 2</a></li>
               <li><a href="#">sublink 3</a></li>
               <li><a href="#">sublink 4</a></li>
            </ul>
    </li>
        <li><a href="#">link 2</a>
          <ul>
               <li><a href="#">sublink 1</a></li>
               <li><a href="#">sublink 1</a></li>
            </ul>
    </li>
</ul>
Код:
ul {
   margin: 0;
   padding: 0;
   float: left;
   background-color: #b0ffb1;
}

li {
   float: left;
   position: relative;
   list-style-type: none;
   border-right: 1px solid #000000;
}

a {
   display: block; 
   text-decoration: none;
   padding: 0px 70px 0px 10px; 
   color: #006699;  
}
a:hover {
   color: #ff3333;
}
li:hover {
   background-color: #ffffff;
} 

/* Раскрывающееся меню */

ul li ul {
   margin: 0px;
   position: absolute; 
   left: -1px; 
   width: 100%;
}
ul li ul li  {
   width: 100%; 
   border-left: 1px solid #000000; 
   border-bottom: 1px solid #000000;
   border-right: 1px solid #000000;
}
ul li ul {
   display: none;
}
ul li:hover ul, div#menunav ul li ul:hover {
   display: block;
}
Если помог - Весы слева
KREGI вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выпадающее меню voldemen HTML и CSS 0 15.07.2010 13:39
Выпадающее меню DICTATOR Помощь студентам 3 28.11.2009 15:18
Выпадающее меню dieselred HTML и CSS 1 19.07.2009 21:45
Выпадающее меню CHERT БД в Delphi 17 16.06.2007 04:55