悬停两个巢的元素

Question

通过使用纯CSS（无JavaScript），如何才能 .a和.b，两者 .a和.b变红？ （这可以解释为“当我悬停.b，.a变红”）

HTML：

<div class="a">AAAAA<div class="b">BBBBB</div></div>

一些CSS绝望失败的尝试：

.b:hover .a {color: red;}
.a.b:hover {color: red;}
.b:hover + .a {color: red;}
.b:hover ~ .a {color: red;}
.b:hover < .a {color: red;}

但是感觉任何可以选择父元素的东西都行不通。

Answer 1

<不存在且+为~是相邻的兄弟选择器，但仅适用于后续元素。

基本上，你不能用纯CSS做到这一点，因为它不存在像父选择器这样的东西你需要指定如果.b悬停的样式也是父元素

Answer 2

将此样式添加到您的页面

<style type="text/css">
    .a:hover{
   background-color:red;
}
    </style>

希望这适合你。