С Новым годом! Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.85/13: Рейтинг темы: голосов - 13, средняя оценка - 4.85
 Аватар для Lynatik001
48 / 40 / 15
Регистрация: 28.09.2012
Сообщений: 818

Не пойму как в меню при наведении отобразить под меню

15.06.2014, 01:07. Показов 2715. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Сделал простенькое меню, как мне при наведении на ли отобразить ul что по умолчанию display none
Проще говоря как в css составить запрос что при наведении на родителя менялся б display у ребенка и подменю появлялось
все готово вот только не выходит такого рода запрос сосавить, css плохо знаю(
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
    <div class="tmenu">
    <ul>
    <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
    <li><a href="#"><img src="/images/type2.png"></a><span>Цена</span></li>
    <li><a href="#"><img src="/images/type3.png"></a><span>Цена</span></li>
    <li><a href="#"><img src="/images/type6.png"></a><span>Цена</span></li>
    <li><a href="#"><img src="/images/type4.png"></a><span>Другое</span>
        <ul class="absol">
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
                        
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
 
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
            <li><a href="#"><img src="/images/type1.png"></a><span>Цена</span></li>
        </ul>
    </li>
    </ul>
    </div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
.tmenu > ul{
 
    display: inline-block;
 
}
 
.tmenu > ul > li{
    margin: 50px;
    display: block;
     width: 100px;
     height: 120px;
     float : left;
}
.tmenu > ul > li > ul{
    z-index : 1000;
        width: 440px;
    position: absolute;
    top: 180px;
    left: 600px;
    background: white;
    border-radius: 10px;
    display: none;
box-shadow: 2px 2px 2px 2px rgba(50, 50, 50, 0.75);
}
 
.tmenu > ul > li:hover .tmenu > ul > li > ul{
    display: normal;
}
 
.tmenu > ul > li > ul > li{
    margin: 20px;
    display: block;
     width: 100px;
     height: 120px;
     float : left;
}
.hides{
 
}
.tmenu > ul > li >img{
 width: 100px;
 height: 100px;
}
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
15.06.2014, 01:07
Ответы с готовыми решениями:

Работа меню при наведении, оставить фон основного меню
Добрый день! Помогите решить вопрос. Есть dropdown меню (белый буквы и черные фон) открывается при наведении, цвет и текст основного меню...

Меню не полностью показывается при частом наведении на это меню
Имеется выпадающее меню ul &gt; li, показываемое с помощью .slideDown/.slideUp. Подскажите пожалуйста, почему при частом наведении курсора...

Polylang на wordpress и двуязычное меню. Как отобразить нужное меню?
Всем привет. У меня двуязычный (ru, en) блог на wordpress. Двуязычность организовал с помощью Polylang. Все хорошо с отображением...

3
5 / 5 / 2
Регистрация: 14.06.2014
Сообщений: 201
15.06.2014, 01:14
Цитата Сообщение от Lynatik001 Посмотреть сообщение
<ul class="absol">
В HTML файле у Вас есть класс "absol", в CSS файле нет absol поэтому и не отображает Вам подменю. Допишите к элементу absol в CSS файле.
0
 Аватар для Lynatik001
48 / 40 / 15
Регистрация: 28.09.2012
Сообщений: 818
15.06.2014, 01:36  [ТС]
Цитата Сообщение от cybersoft Посмотреть сообщение
В HTML файле у Вас есть класс "absol", в CSS файле нет absol поэтому и не отображает Вам подменю. Допишите к элементу absol в CSS файле
во 1 он тут не причем я через предведущий клас подбирался к тегам.
Во 2 мне нужно реагировать при наведении, ul с absol не виден как мне на невидимость наводить что бы она отобразилась?
Код лучше напишите
0
1030 / 682 / 297
Регистрация: 04.04.2013
Сообщений: 2,751
15.06.2014, 06:05
Лучший ответ Сообщение было отмечено Lynatik001 как решение

Решение

Lynatik001, вот так:
CSS
1
.tmenu > ul > li:hover > ul{display: block;}

А эта строчка вообще не понятно что должна делать, можете ее удалить:
CSS
1
2
3
.tmenu > ul > li:hover .tmenu > ul > li > ul{
    display: normal;
}
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
15.06.2014, 06:05
Помогаю со студенческими работами здесь

При наведении не активные пункты меню смещаются, и не применяются изменения фона при наведении
У меня возникла проблема, при наведении не активные пункты меню смещаются, и не применяются изменения фона при наведении.&lt;!DOCTYPE...

Как реализовать подобное при наведении в меню
Как реализовать подобное при наведении в меню? Чтобы при наведении на слово сзади появлялась картинка и пунктирная линия при условии что...

Как мне изменять картинку в меню при наведении на ссылку
Привет всем у меня есть горизонтальное меню на css. Как мне сделать чтобы при наведении на ссылку меню менялась иконка для этой ссылки....

Как поменять картинку в другом блоке при наведении на меню
Помогите,пожалуйста, в решении задачи. Изначально : слева в столбик кнопки меню, ближе к правому краю - блок, в который загружена картинка....

Как создать меню с картинками, закрашивающимися при наведении курсора
Здравствуйте. Как на HTML + CSS создать меню с картинками, закрашивающимися при наведении курсора мыши? На примере курсор мыши наведен...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает?
Neotwalker 09.01.2026
В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .
Модель микоризы: классовый агентный подход 3
anaschu 06.01.2026
aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR
ФедосеевПавел 06.01.2026
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .
Модель микоризы: классовый агентный подход 2
anaschu 06.01.2026
репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .
Расчёт токов в цепи постоянного тока
igorrr37 05.01.2026
/ * Дана цепь постоянного тока с сопротивлениями и источниками (напряжения, ЭДС и тока). Найти токи и напряжения во всех элементах. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа и. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru