在父hover上更改子元素的CSS类

Question

我的Html：

<div class="parent">
 <span class= "child"></span>
</div>

当我将鼠标悬停在父元素上时，我希望更改子span标记的CSS，并将mouseout上的子节点上的CSS恢复为父节点。我怎么能用CSS＆amp; HTML？

Answer 1

.parent:hover .child{ some props }

Answer 2

试试这个：

使用css：hover中的普通伪元素，添加子元素.child以添加其样式

.parent:hover .child{ 
       background-color:red; 
      }