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

Менять цвет текста при наведении

12.11.2016, 19:49. Показов 3375. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте.
Помогите, пожалуйста, решить проблему.
Есть блок а, в нем блоки b, c.
При наводке курсора на всю "поверхность" блока а тексты в блоках b, c должны менять цвет.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
<head>
<style>
div.a{}
div.a:hover{color:blue;}
div.b{color:red;}
div.c{color:red;}
</style>
</head>
 
<body>
<div class='a'>
<div class="b">
asdasd</div>
<div class="c">
ertertert</div>
</div>
</body>
</html>
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
12.11.2016, 19:49
Ответы с готовыми решениями:

Изменить цвет текста при наведении на блок
Привет всем! Я учусь верстать сложные шаблоны! Вышла такая проблема. При наведение мышкой на блок появляется синий цвет блока! А текст не...

Эффект при наведении. При наведении на впереди стоящий элемент, предыдущие элементы меняли цвет border
Необходимо реализовать это по возможности без js. Если есть какие-то варианты на css, буду рад изучить вопрос! Благодарю! На рисунке...

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

3
Богатый духовно
 Аватар для boilzzz
455 / 262 / 145
Регистрация: 10.03.2015
Сообщений: 1,057
12.11.2016, 20:46
khrustal,
CSS
1
2
div.a:hover .b{color:blue;}
div.a:hover .c{color:blue;}
0
2 / 2 / 0
Регистрация: 26.11.2013
Сообщений: 248
12.11.2016, 21:57  [ТС]
Я наверное не очень точно описала задачу. Надо , чтобы при наводке на div.b менялось цвет текста не только в div.b, но и в div.c, и наоборот.
0
Эксперт HTML/CSS
 Аватар для Fedor92
2964 / 2621 / 1068
Регистрация: 15.12.2012
Сообщений: 10,091
Записей в блоге: 11
12.11.2016, 22:47
khrustal, div.b к div.c сделаете:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!doctype html>
<html>
    <head>
        <style>
            div.b:hover + .c{color:red}
            div.b:hover{color:red}
        </style>
    </head>
 
    <body>
        <div class="a">
            <div class="b">asdasd</div><div class="c">ertertert</div>
        </div>
    </body>
</html>
А наоборот уже не получится... По причине:
Стиль при такой записи применяется к элементу div.c, но только в том случае, если он является соседним для элемента div.b и следует сразу после него.
А поскольку div.b следует до div.c, то Вам даже соседние селекторы не помогут...
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
12.11.2016, 22:47
Помогаю со студенческими работами здесь

Как при наведении на li менять фон у блока слева
Добрый вечер, подскажите как можно сделать так чтобы при наведении на пункт li менялся фон у блока слева. &lt;main...

Менять фон всей страницы при наведении на кнопку
Здравствуйте, хотел сделать на заготовке станицы кнопку(not push), чтобы при наведении менялся фон всей станицы(это будет что-то вроде...

Кнопка отказывается менять свой вид при наведении и активации
Доброго времени суток товарищи! Итак, ситуация такова: Решил сделать на сайте красивую кнопочку, которая будет менять свой облик при...

Как при наведении на текст менять картинку вместе с текстом
Здравствуйте, подскажите пожалуйста как быть, мне нужно что бы при наведении на текст менялась картинка вместе с текстом, при наведении на...

Как при наведении на дочерний блок менять стиль родительского блока
Здравствуйте, подскажите пожалуйста как при наведении на дочерний блок менять стиль родительского блока? Например: &lt;div...


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

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Семь 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