将鼠标悬停在一个元素上以影响div，然后再不影响它

Question

我想在悬停时设置<div b以影响<div> a。我已经看到使用（+）

的反向代码

#a:hover + #b {
    background: #ccc
}

<div id="a">Div A</div>
<div id="b">Div B</div>

但有没有影响相反的情况呢？ Div B影响Div A而不影响B？

Answer 1

正如已经提到的，这在技术的这一点上作为CSS解决方案是不可行的。您需要依赖Javascript。

以下是适合您的jQuery解决方案：

$('#b').hover(
    function(){ $('#a').addClass('yellow') },
    function(){ $('#a').removeClass('yellow') }
)

<强> JSFiddle

Answer 2

选择器级别4草稿定义了选择器的subject，允许您使用

!#a + #b:hover {
    background: #ccc
}

然而，AFAIK浏览器尚不支持它。

并且还注意到它是complete选择器配置文件的一项功能，因此它对性能不敏感。