html - 当另一个 Div 悬停在第一个 Div 之后时如何更改 Div 的 CSS 属性

<分区>

我有 DIV 1 和 DIV 2。在代码中，Div 2 位于 Div 1 之后。我想在悬停 Div 2 时更改 Div 1 的背景颜色。最好是不想改HTML结构，也不想用JS。

div {
  background-color: yellow;
  padding: 20px;
  display: none;
}
  
span:hover div {
  display: block;
}

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<div>I will show on hover</div>
<span>Hover over me!</span>


</body>
</html>

提前致谢。

最佳答案

如果您更改生成 div 和 span 的顺序，您可以做您想做的事。如果你不想改变元素的顺序，没有 JS 是不可能的。

div {
  background-color: yellow;
  padding: 20px;
  display: none;
}
  
span:hover + div {
  display: block;
}

<span>Hover over me!</span>
<div>I will show on hover</div>

关于html - 当另一个 Div 悬停在第一个 Div 之后时如何更改 Div 的 CSS 属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58475660/