当你悬停在两个盒子上时，我怎样才能使两个盒子变成一个颜色？
当你悬停在两个盒子上时，我怎样才能使两个盒子变成一个颜色？
提问于 2014-08-13 19:14:30
目前，当你悬停在蓝色的盒子上都变成黄色的时候，但是当你在红色的盒子上悬停时，只有它变成黄色。
当你在蓝色或红色上空盘旋时，我需要它们都变成黄色。
这就是我所得到的：
<!DOCTYPE html>
<html>
<head>
<style>
#one {
background-color: blue;
width: 50px;
height: 50px;
float: left;
}
#two {
background-color: red;
width: 50px;
height: 50px;
float: left;
margin-left: 100px;
}
#two:hover {
background-color: yellow;
}
#two:hover ~ #one {
background-color: yellow;
}
#one:hover {
background-color: yellow;
}
#one:hover ~ #two {
background-color: yellow;
}
</style>
</head>
<body>
<div id="one"></div>
<div id="two"></div>
</body>
</html>回答 4
Stack Overflow用户
回答已采纳
发布于 2014-08-13 19:32:58
Stack Overflow用户
发布于 2014-08-13 19:26:04
Stack Overflow用户
发布于 2014-08-13 19:32:44
用:before模拟悬停的div #one
HTML保持不变
CSS
#one {
background-color: blue;
width: 50px;
height: 50px;
float: left;
}
#two {
background-color: red;
width: 50px;
height: 50px;
float: left;
margin-left: 100px;
}
#one:hover, #one:hover ~ #two, #two:hover {
background-color: yellow;
}
#two:before {
content:'';
display:none;
width:50px;
height:50px;
margin-left:-150px;
background-color: yellow;
}
#two:hover:before {
display:block;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25294333
复制相关文章
相似问题
腾讯云开发者
