悬停效果背景和字体效果

Laura 发表于 Dev

劳拉

我究竟做错了什么？

这是我的代码：

ul li:hover {
  background-color: rgb(151, 75, 31);
}

ul li a {
  text-decoration: none;
  color: black;
}

ul li a:hover {
  color: whitesmoke;
}

<nav>           
    <ul>         
      <li><a href="#">Carrinho</a></li>
      <li><a href="#">Lupa</a></li>
      <li><a href="#">Free Training</a></li>
      <li><a href="#">Blog</a></li>
      <li><a href="#">ShowQase</a></li>
      <li><a href="#">Shop</a></li>
      <li><a href="#">Course</a></li>
      <li><a href="#">About</a></li>           
    </ul>           
</nav>

我想要的是将鼠标移到li字体上时变成白色，而不仅仅是将鼠标移到链接a上。

多谢你们

阿努拉格·斯里瓦斯塔瓦

采用 ul li:hover a

ul li:hover {
  background-color: rgb(151, 75, 31);
}

ul li a {
  text-decoration: none;
  color: black;
}

ul li:hover a {
  color: whitesmoke;
}

<nav>           
    <ul>         
      <li><a href="#">Carrinho</a></li>
      <li><a href="#">Lupa</a></li>
      <li><a href="#">Free Training</a></li>
      <li><a href="#">Blog</a></li>
      <li><a href="#">ShowQase</a></li>
      <li><a href="#">Shop</a></li>
      <li><a href="#">Course</a></li>
      <li><a href="#">About</a></li>           
    </ul>           
</nav>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。