<分区>
<分区>
你好,谢谢大家看一看我的问题:这是我的问题:
#div1 {
background: red;
width: 200px;
height: 200px;
}
#div2 {
background: blue;
width: 200px;
height: 200px;
}
<div id="div1"></div>
<div id="div2"></div>
现在我想通过悬停 div1 将 div2 的背景更改为绿色,我该怎么做才能仅使用 css?
更新:我有同样的问题,但另一个故事:
--HTML--
<div id="div1"></div>
<div id="wrapper">
<div id="div2"></div>
</div>
--HTML--
--CSS--
#div1 {
background: red;
width: 200px;
height: 200px;
}
#div2 {
background: blue;
width: 200px;
height: 200px;
}
#wrapper{
width:500px;
height:500px;
}
--CSS--
如图:
#div1:hover + #wrapper #div2{
background:green;}
不知道为什么#div1:hover + #div2 不起作用
最佳答案
您可以使用 +
css 选择器来实现,它直接选择当前元素之后的元素
div {
height: 50px;
width: 50px;
border: 1px solid black;
}
#div1:hover+#div2 {
background-color: green;
}
<div id="div1"></div>
<div id="div2"></div>
关于HTML/CSS 悬停一个对象使另一个对象改变它的属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52387628/