id：css中的悬停id？是否可以？

这是我的 html 代码

<div id="id_1"></div>
<div id="id_2"></div>
<div id="id_3"></div>
<div id="id_4"></div>

这是我的 CSS 代码

<style>
#id_1:hover #id_2{background-color:red;}
#id_1:hover #id_3{background-color:red;}
#id_1:hover #id_4{background-color:red;}
#id_2:hover #id_4{background-color:red;}
</style>

这个悬停为什么不起作用？谁来帮帮我 ？

我需要当我悬停#id_1时，将更改背景颜色#id_2

因为这些 div 是兄弟姐妹，所以你需要使用general sibling selector or ~

#id_1:hover ~ div

这将匹配所有同级元素#id_1类型为div，您可以使用它而不是为每个编写单独的选择器div

#id_2:hover ~ #id_4

这将仅匹配的同级元素id_2具有#id_4，如果你只想匹配 div 你可以添加div#id_4

#id_1:hover ~ div {
  background-color: red;
}

#id_2:hover ~ #id_4 {
  background-color: red;
}

<div id="id_1">div</div>
<div id="id_2">div</div>
<div id="id_3">div</div>
<div id="id_4">div</div>

如果您只想在鼠标悬停时更改下一个同级元素的颜色#id_1您可以使用adjacent sibling selector or +

#id_1:hover + div {
  background-color: red;
}

<div id="id_1">div</div>
<div id="id_2">div</div>
<div id="id_3">div</div>
<div id="id_4">div</div>