Javascript 如何使用Css嵌套div来实现外部div？

我想让child div效果成为outer div，我想让box1把中间div box2 bg改成其他的，没有脚本我怎么能做到呢？我试过了，但失败了35; box:hover#box2 也以“+”失败

在这里盘旋
改变这个背景
在这里盘旋

这个答案更多的是出于好奇，而不是真正的解决方案。

如果嵌套框位于流中前面的div中，您希望看到背景更新的框，则可以使用

指针事件

来控制将对悬停作出反应的区域

---

请记住：CSS选择器只能沿DOM树向下导航，无法向上爬升。

---

基本CSS是：

div {
  pointer-events:none;
}
div #box1 {
  pointer-events:auto;
}
div:hover + div {
  background:red;
}

用于：

在这里盘旋
改变这个背景

首先，如果您不想使用脚本，请不要使用javascript或jquery标记

您不能有两个ID相同的div（或任何内容），如果您想有两个使用类，那么它们是否相同并不重要。只使用了第一个（我想，它可能是最后一个…），而忽略了其他的

回答问题 +combinator仅适用于兄弟姐妹，即他们必须一起在同一个div中，而不是嵌套在任何其他div中，并且必须直接一个接一个，因此

。父：hover+。父2

仅适用于第一个div。如果中间有其他元素，则可以使用

~

而不是

+

.father

和

.father2

这部分回答了问题，我不知道如何让第二个开始工作

---

不幸的是，仅使用CSS，目前无法选择父元素。您需要使用jQuery/Javascript等脚本语言。如果您想知道如何执行此操作的示例，只需询问：）#每个文档只能使用一次box1（ID），而使用.box1（CLASS）。Javascript会做你想做的事情：）另外，为了好玩和指针事件的使用：@fizzix检查一下这个有趣和好奇的地方，很有趣，我不知道，谢谢@GCyrillus的例子。尽管如此，如果将

box2

移到

father

上方，它为什么会停止工作？@fizzix如果将box2移到上方，CSS选择器无法访问它，您只能向下导航dom树：）这是否适用于乘法框？我将做一个小div，它将是角色的拇指，我们悬停在每个角色上，中间的图片将改变：）如果要改变的背景位于流中的下一个位置，并且如果浏览器支持指针事件，它应该可以工作。但是如果DOM稍微改变，它将不起作用。在您的示例中，将

框2

移动到

父对象的上方，它将停止工作。@fizzix我就是这么说的。选择器可用仅+或~可向下导航dom树。而且爬升的选择器肯定不会被支持（据我所知，它会涉及太多资源）啊，有趣。因此，
++
可以用来向下操作树，尽管还没有选择器（现在）可以向上操作树？你用选择器+（selector+）检查我的演示了吗？指针事件涉及其中，因此您需要一个浏览器来获取它：）我想我会让我的兄弟给我写一个脚本：/i恐怕这对我的需求示例不起作用：@GCyrillus很抱歉耽搁了，我有一段时间没有这样做了。我以前从未听说过指针事件。在看过你的css后，我想我理解了它的原理。（你先发布了你的答案，但我在别人发布任何答案之前就开始写我的答案，所以在发布我的答案之前我没有阅读你的答案）
div {
  pointer-events:none;
}
div #box1 {
  pointer-events:auto;
}
div:hover + div {
  background:red;
}

<div class="father">  
  <div class="child2">
    <div id="box1" class="child3"> hover here </div>
  </div>  
</div>                
<div id="box2" class="father2"> 
  change this background 
</div>