css选择器相当于$（this）

Question

CSS中的Jquery选择器$(this)是否等效？像这样：

.widget h4 { background: black }
.widget:hover h4 { background: white }

在这种情况下，如果{em>任何的.widget分类元素悬停在上面，则子h4将改变背景颜色。我问是否有一种方法在CSS 中执行此操作，以便仅单个h h4的{​​{1}}有一个bg颜色变化，而不是每个具有类.widget的元素。是的，我在谷歌搜索过，发现没有任何答案。谢谢你的帮助。

Answer 1

您发布的代码应完全按照您的描述进行操作：

<强>的CSS：

.widget h4 { background: red }
.widget:hover h4 { background: white } 

<强> HTML：

<div class="widget">
   <h4>Hover here</h4>
   <h3>This won't change</h3>
</div>

<div class="widget">
    <h4>Hover here</h4>
</div>

使用该代码，如果您将鼠标悬停在其中任何一个div .widget上，它只会更改直接子h4而不会更改另一个div中的那个。

请参阅此jsfiddle