我用两边的填充和背景色制作了一个导航。我在文字上使用默认颜色，并在悬停时使背景变成了另一种颜色。问题是我希望文本在悬停背景时改变颜色，而不是仅因为我需要使用与默认文本相同的颜色作为背景颜色[悬停时]，如果我悬停，那么基本上是不可见的文本，因为背景和文本的颜色相同。我希望即使将文字悬停在文字（而不是文字）外部的空间上，文字颜色也要改变。
jsfiddle- http://jsfiddle.net/ucsk99cL/
<aside class="sidebar">
<nav>
<ul>
<li style=""><a href="">home</a></li>
<li><a href="">about us</a></li>
<li><a href="">orders</a></li>
<li><a href="">gallery</a></li>
<li><a href="">contact</a></li>
</ul>
</nav>
</aside>
.sidebar{
float:left;
margin:20px;
margin-right:150px;
}
nav ul li a{
text-decoration:none;
font-family:myriad pro;
font-size:20px;
color:#3d2316;
}
nav ul li{
padding-top:26px;
padding-bottom:26px;
padding-left:57px;
padding-right:57px;
margin-bottom:3px;
background-color: #CBAFA2;
}
nav ul li:hover{
background-color: #3D2316;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句