css - 悬停一个 div 以更改另一个 div 上的 css

Question

当鼠标悬停在另一个 div 上时，我正在尝试更改文本的颜色。

用jsFiddle **会更好地解释：

我想要做的是（使用 CSS），当我在第一个 cicle 上移动鼠标时，它会改变文本的颜色（结果 1）。

通过使用类似的方法，我尝试了在 stackoverflow 上搜索以前的问题时发现的内容：

div.circleoff:hover ~.test {
    color: #fff
}

score 0 · Accepted Answer

Eric Meyer 在他的网站上有一些演示可以帮助解决这个问题。查看“弹出”部分。它可以很容易地调整以适应这个。

score 0 · Accepted Answer

如果您正在寻找嵌套元素（不是兄弟元素）的颜色变化，请使用

#schema>div:hover span { color:white; }

这意味着悬停在#schema' 的直接子级（division 元素）上会导致其所有嵌套span的 s 变为白色。

score 0 · Accepted Answer

您需要检查您的 css 选择器的特殊性。此外，您不应该使用兄弟运算符。我认为这就是你想要做的（用下面的代码替换了最后两条规则）。

#schema div.circleoff:hover + .circleoff2 .test,
#schema div.circleon:hover + .circleoff2 .texte {
  color: #fff
}

3 回答 3