Ответ 1
#parent_div:hover #child_div_1 {
color: blue;
}
#parent_div:hover #child_div_2 {
color: red;
}
У меня есть вопрос, и я не уверен, что это возможно, но я подумал, что попробую спросить.
Скажем, у меня было три div:
<div id="parent_div">
<div id="child_div_1">Blue</div>
<div id="child_div_2">Red</div>
</div>
Если весь текст внутри parent_div установлен на черный, как бы сделать, чтобы child_div_1
и child_div_2
менял шрифт-цвет на синий и красный соответственно, когда родительский div зависает над?
Извините, если это немного запутанно, но есть ли способ сделать это предпочтительно только с помощью CSS?
#parent_div:hover #child_div_1 {
color: blue;
}
#parent_div:hover #child_div_2 {
color: red;
}
Просто настройте соответствующие дочерние элементы на основе состояния :hover
родителя:
/* defaults */
#parent_div div {
color: #000; /* or whatever... */
}
/* hover rules */
#parent_div:hover #child_div_1 {
color: blue;
}
#parent_div:hover #child_div_2 {
color: red;
}
Используйте псевдо-класс :hover
для родительского элемента:
#parent_div { color: black; }
#parent_div:hover #child_div_1 { color: blue; }
#parent_div:hover #child_div_2 { color: red; }