#html #css
#HTML #css
Вопрос:
у меня есть два div. из второго div a: наведите курсор, я хочу добавить непрозрачность в img
<div class="hide">
<img src="/img.png">
</div>
<div class="onhover">
<a class=""onhover_change>
</div>
Если у кого-нибудь есть идея, дайте мне знать.
Я не понимаю, как применить css к элементу выше div
Комментарии:
1. Это невозможно, CSS не знает родительский / предыдущий селектор родственных элементов. Вы можете настроить таргетинг только на родственные и / или дочерние элементы.
2. Как упоминалось выше, это невозможно с этим HTML и просто CSS. Однако вы можете использовать JS или изменить структуру вашего HTML (сохраняя при этом вывод, выглядящий одинаково) Если вы открыты для этих решений, стоит упомянуть об этом в вашем вопросе, что вы можете / не можете изменить.
Ответ №1:
Измените свой HTML, как
.wrapper{
display:flex;
flex-direction:column;
}
.onhover{order:1}
.hide{order:0}
.onhover:hover .hide{
opacity:0.3;
} <div class="wrapper">
<div class="onhover">
<a class=""onhover_change>dsd</a>
</div>
<div class="hide">
<img src="/img.png">
</div>
</div>