Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.57/7: Рейтинг темы: голосов - 7, средняя оценка - 4.57
0 / 0 / 0
Регистрация: 31.03.2016
Сообщений: 36

Свойство hover

15.02.2017, 22:26. Показов 1390. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Доброй ночи киберфорумцы) Меня мучает такой вопрос: Можно ли с помощью сss сделать так, что бы при навведение блок, контент менялся. То есть, у меня есть родительский блок, а в нем 2 дочерних, и у одного из них прописано свойство display:none, и при наведении на родительский, это свойсвто передавалось другому блоку, а даный становился видимым. Знаю что можно реализовать это на js, но меня пока больше интересует вариант на css)
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
15.02.2017, 22:26
Ответы с готовыми решениями:

CSS свойство hover
Друзья, помогите разобраться. Если я позиционирую <ul> абсолютно и даю ему margin-top: 50px, например, то подменю сразу исчезает, как...

Не применяется свойство :hover к картинке
На сайте http://www.lucascrafts.com/ пытаюсь сделать чтоб при наведении на товар фото становилось полупрозрачным. Но блин на :hover в...

Не работает ссылка и свойство hover
так понял все из-за того что радительский див position: relative;, но как всетаки сделать что б заработала ссылка - изменять position:...

4
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
15.02.2017, 22:38
Лучший ответ Сообщение было отмечено mrtoxas как решение

Решение

d3v1ldream, так?

HTML5
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
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        div{
            border:2px solid red;
            display: inline-block
        }
        .hidden, .visible{
            padding:10px
        }
        .hidden{
            visibility:hidden;
            color:red
        }
        .visible{
            color:blue
        }
        div:hover>.hidden{
            visibility:visible
        }
        div:hover>.visible{
            visibility:hidden
        }
    </style>
</head>
<body>
    <div class="box">
            <span class="hidden">Скрытое слово</span>
            <span class="visible">Видимое слово</span>
    </div>
</body>
</html>
0
0 / 0 / 0
Регистрация: 31.03.2016
Сообщений: 36
15.02.2017, 22:50  [ТС]
А можно как то сделать, что бы он на его место становился?

Добавлено через 3 минуты
Спасибо, уже сам разобрался)Использовал display:none/block. А как называються вот эти оператори в сss?)Очень полезная штука)
Цитата Сообщение от Fedor92 Посмотреть сообщение
div:hover>.hidden
А
0
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
15.02.2017, 22:54
Цитата Сообщение от d3v1ldream Посмотреть сообщение
А как называються вот эти оператори в сss?)
Какие операторы?
div - селектор элемента
:hover - псевдокласс
>-указывает на вложенность элемента и указывает строгость определения стилевых свойств
.hidden - селектор класса
0
0 / 0 / 0
Регистрация: 31.03.2016
Сообщений: 36
15.02.2017, 23:34  [ТС]
Цитата Сообщение от Fedor92 Посмотреть сообщение
>-указывает на вложенность элемента и указывает строгость определения стилевых свойств
Я про это спрашивал)
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
15.02.2017, 23:34
Помогаю со студенческими работами здесь

Не кооректно работает свойство Hover
народ в каких случаях может не работать hover.....Проблема в том сто вот эта часть css кода работает частично..... #nav li a:hover{ ...

Как прописать css свойство hover в html
Добрый вечер! &lt;a style=&quot;color:black&quot;;&gt;'.$m.'&lt;/a&gt; У меня установлен цвет шрифта и я хочу добавить а:hover, что бы при наведении менялся...

Применить свойство hover через другой объект
Здравствуйте Структура такова: &lt;div class=&quot;bl1&quot;&gt; &lt;div class=&quot;bl11&quot; &lt;/div&gt; &lt;div...

Как применить свойство hover к элементу списка, когда элемент - ссылка
Добрый день, подскажите пожалуйста, как применить свойство hover к элементу списка, чтобы поменять стиль при наведении на весь элемент? ...

CSS (hover) отменить действие последнего hover на все элементы
Всем доброго времени суток. У меня следующая загвоздка: нашел скрипт для выпадающих меню. Подогнал под себя css, который собирал эти...


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

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru