HTML和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}然后我也想在悬停<h4>时也定位我的<div> <h4> ，但是没有像“父选择器”这样的目标定位我的div。 那我该怎么办呢？ （我不想用<a>标签包装<div>和<h4> ）。

谢谢！

Answer 1

首先，您需要在最外面的div上创建一个类，以便能够直接引用该类，而不必同时引用“ inner 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;
}