html - 使用 CSS 在悬停时更改父和子 div

Question

一些代码...

<a href="#">
<div class="col-md-4">
<img src="image.jpg">
<div class="text">TEXT</div>
</div>
</a>

还有一些 CSS 开始......

.col-md-4 {
background color: #000;
}
.text {
color: #fff;
}

我想在翻转时更改 col-md-4 IMAGE 不透明度。同时，我还需要在滚动时改变颜色的文本。

我可以让一个或另一个工作 - 文本或 div，但不能同时工作。

知道我需要做些什么才能在翻转时同时定位这两个目标吗？

Answer 1

根据您的评论，我相信这就是您所追求的。

   .col-md-4:hover img {
    opacity:0.6
    }

这将仅在悬停 div 时更改图像的不透明度。

对于文字的改变

   .col-md-4:hover .text {
    color: /* other color */
    }