HTML＆amp; CSS，父选择器？

Question

所以我的问题是我要将<div>背景颜色和我的<h4>更改为red，要么将鼠标改为<div>或<h4> }。

这是我的html（没有不必要的类）。

<div>
    <a href="#"><div><span class="icon-bubbles3"></span></div></a>
    <a href="#"><h4>News</h4></a>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>

所以我一直在尝试应用h4:hover {color: red}然后我想在我的<div>上同时定位<h4>，但没有类似“父选择器”来定位我的<div> DIV。那我该怎么做呢？ （我不想用<h4>标记包装<a>和{{1}}。

谢谢！

Answer 1

首先，你需要在最外层的div上使用一个类，以便能够直接引用它而不引用“内部div”：

<div class="mydiv">
    <a href="#"><div><span class="icon-bubbles3"></span></div></a>
    <a href="#"><h4>News</h4></a>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>

然后你可以打电话：

.mydiv:hover div {
   background-color:red;
}
.mydiv:hover h4 {
   color:red;
}