如何在父项悬停时更改子元素的不透明度

Question

我希望在父div悬停时更改子div图像的不透明度.如何在CSS中执行此操作？

<div class="parent">
    <div class="child">
        <img src="" alt="" height="" width="">
    </div>
</div>

Answer 1

使用:悬停选择器并更改img opacity:

.child:hover img {
    opacity: 0.8;
}

或者如果你想改变while子div的不透明度,那么:

.parent:hover .child {
    opacity: 0.8;
}