悬停时的 CSS 链接背景色

Question

我有这个代码

<nav><details><summary>Pests</summary><ul>
    <li><a href="somewhere">Bugs</a></li>
    <li><a href="">Rodents</a></li></ul>
</details></nav>

用这个CSS

nav > details li:hover{background-color:white}
details > ul{list-style:none;background-color:orange;padding-left:15px;margin:0 15px}

当我将鼠标悬停在链接上时，会保留一小部分橙色背景。如何更改代码以使整行背景变为白色？我尝试了去除填充等的变体，但这以不需要的方式改变了空间格式。帮助不大。谢谢。

Answer 1

你可以试试:

   nav > details li{padding-left: 15px;}
   nav > details li:hover{background-color:white;}
   details > ul{list-style:none;background-color:orange;padding-left:0;margin:0 15px}