鼠标移入div1 div2发生改变，div2不在div里，有办法用纯css实现吗？

Question

<style>
#div1{width:200px;height:200px;background-color:red;}
#div2{width:200px;height:200px;background-color:yellow;}
</style>
<div id="div1"></div>
<div id="div2"></div>
要求鼠标移入div1时，div2发生变化，纯css可以实现吗？

Answer 1

#div1:hover+#div2{background-color:green;}
在style中加入如上代码
用相邻兄弟选择器 “+”，当鼠标移入div1时div2的背景颜色改为绿色，如果你想实现其他效果，改变上面代码中“{}”里的内容即可