在父div悬停时更改子div的背景颜色？ [复制]答案

【问题标题】：Change background color of child div on hover of parent div? [duplicate]在父div悬停时更改子div的背景颜色？ [复制]
【发布时间】：2018-08-11 16:23:19
【问题描述】：

我想在父 div 悬停时更改子 div 的背景颜色。目前，我可以更改颜色，但只能在子 div 上悬停。但是，我也想更改父 div 悬停时的颜色。

<div class="content">
<div class="logo">Button</div> 
</div>

<style>
.content {
position:relative;
margin:0 auto;
width:300px; height:250px;
background-color:blue;
overflow: hidden;
}

.logo {
margin:50px auto;
background:yellow;
text-align:center;
}

.logo:hover {
background: red;
}
</style>

看到这个：http://jsfiddle.net/bCkpb/10/

【问题讨论】：

标签： html css

【解决方案1】：

使用 CSS 你可以做到这一点：

.parent:hover .child, .parent.hover .child { background: green; }

这里是更新后的代码：http://jsfiddle.net/bCkpb/17/

【讨论】：

您的代码看起来很奇怪。不应该是 .content:hover, content:hover .logo {背景：绿色； }
它看起来很奇怪（尤其是 .parent.hover 部分），但它按预期工作。