导航中的锚标记导致悬停颜色不起作用

Question

我已经包含了一个jsfiddle来向你展示一个例子.我的导航ul项设置为白色背景,字体为红色.当我想要两种颜色交换时,背景变为红色,字体变为白色.在我将锚标签放入其中之前,但是在悬停后字体没有变为白色.如果我添加这个:

nav ul li a:hover{
    color:white;
}   

字体将变为白色,但不会在盒子悬停时,但仅当字体本身悬停时,但我希望字体在列表项目框中悬停时更改为白色.有帮助吗？谢谢!

jsfiddle:http://jsfiddle.net/xNZxF/

Answer 1

添加这个:

nav ul li:hover a{
    color:white;
}

jsFiddle例子

为了配合你可能也想加入宽松-webkit-transition: all .5s ease-in-out;到nav ul a.

jsFiddle例子