我对HTML和CSS很陌生,我知道这可能是一个非常愚蠢的问题,但我一直试图解决它一段时间,我无法弄清楚什么是错的.
当鼠标进入与其无关的另一个元素时,我想要一个div来改变它的背景颜色(当div是另一个组件的子元素时,它工作正常).
我的HTML:
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<nav>
</nav>
<div></div>
</body>
</html>
而CSS:
* {
margin: 0px;
padding: 0px;
}
nav {
width: 100%;
height: 50px;
background-color: black;
}
div {
width: 100%;
height: 40px;
background-color: green;
position: absolute;
left: 500px;
}
nav:hover div {
background-color: blue;
}
我已经尝试更改"nav:hover div"div之类的"nav:hover div"规则,但它不起作用......
预先感谢您的帮助.
使用相邻的兄弟选择器 +:
nav:hover + div {
background-color: blue;
}
您尝试过的规则nav:hover div是寻找导航后代的div.你想要兄弟姐妹.
| 归档时间： |
|
| 查看次数： |
15437 次 |
| 最近记录： |