Как скомбинировать классы, чтобы при div:hover свойство применялось к нескольким другим div?

Question

[Виктор Гузинов]

Я использую селектор "~" для того, чтобы при наведении на div, показать div1
Пример:
.class:hover~.class1 {opacity: 1}

Я хотел бы применить свойство к ряду блоков (или элементов) при наведении на единый блок и пока что не смог найти нужную группировку классов. Как их можно сгруппировать?
надеюсь мой вопрос понятен )

Comments

[ProjectSoft]

Вашу реализацию в песочницу. Покажите, что пытались/пытаетесь сделать

[Рома Зварич]

надеюсь мой вопрос понятен

К сожалению, нет, не понятен

Answer 1

[Владимир Солнцев]

На сколько понял задачу, должно подойти.

// Если изменяться должны элементы, которые лежат внутри targetClass
.targetClass:hover .changeClass1,
.targetClass:hover .changeClass2,
.targetClass:hover .changeClass999, { 

}
// Если те, которые рядом лежат, то через  ~

targetClass:hover ~ .changeClass1,
targetClass:hover ~ .changeClass2,
targetClass:hover ~ .changeClass999, {

}

Но вообще, все зависит от структуры разметки. Где и как размещены все эти блоки. Возможно в вашей разметке, с помощью css такое нереализуемо и нужно делать через js.

Comments

[Сергей delphinpro]

Можно просто дать с сылку на все селекторы и их комбинаторы =)
https://developer.mozilla.org/ru/docs/Web/CSS/CSS_...

[Виктор Гузинов]

да, это решает мой вопрос, спасибо