当我将鼠标悬停在 div 上时，我希望它的背景从黑色变为白色，链接的文本从白色变为黑色

Question

我的 div 的背景是黑色的，链接的文本是白色的。

#menu {
 background-color:black;
 width:20%;
 float:left;
}

还有实际的 div。

<div id="menu"><a href="http://menu.com">Menu</a>

我怎样才能使当我将鼠标悬停在它上面时，链接文本变黑，而 div 的背景变黑？

Answer 1

Use :hover pseudo class

#menu:hover a {
color: #000;
}

#menu:hover  {
background-color: #fff;
}

Answer 2

这是你想要的输出吗？

<div id="menu"><a href="http://menu.com">Menu</a></div>

#menu {
 background-color:black;
 width:20%;
 float:left;
}
a{
    color: white;
}
#menu:hover
{
    background-color: white;
}
#menu:hover a
{
    color: black;
}