Html css在悬停时更改链接背景

我想让我的链接的背景颜色改变时，悬停。我知道有很多论坛，但不知何故，我检查了几个论坛。 我想我确实理解这些逻辑，但不知为什么，当我试图在我的网站上实现它时，我无法让它工作。只有链接的背景会改变颜色，而不是整个li会改变

    div.panel.widget.widget_nav_menu {width: 100%; background-color: #EBDDE2;}
    div.panel.widget.widget_nav_menu ul {width: 100%; list-style-type: none;}
    div.panel.widget.widget_nav_menu a {width: 100%; margin-left: 25px;}
    div.panel.widget.widget_nav_menu a:hover {background-color: #EFE4E8;}

有人能帮我一把我错过了什么吗？ 这里是导航位置的链接。

不要尝试使用“锚定”标记，而是将目标指向LI

检查这个

 div.panel.widget.widget_nav_menu {width: 100%; background-color: #EBDDE2;}
    div.panel.widget.widget_nav_menu ul {width: 100%; list-style-type: none;}
    div.panel.widget.widget_nav_menu a {width: 100%; margin-left: 25px;}
    div.panel.widget.widget_nav_menu li:hover {background-color: #EFE4E8;}

---

您可以尝试将链接的

display

属性从

inline

（默认设置）更改为

block

。然后，链接应占据其容器对象的整个宽度（在本例中为

li

）。例如：

widget_nav_menu a {
    display: block;
    padding-left: 25%;
}

这种方法比更改

li

的颜色稍微好一些，因为人们希望更改颜色的整个区域都可以单击

---

此外，没有必要对CSS选择器如此具体。如果你删除

div.panel.widget

它们应该仍然可以正常工作。

@Dora:我在你的网站上检查过它，我的修复程序工作得很好，或者我先尝试了他的方法>。天哪，谢谢我错过了

显示：block

我正在考虑将ul类添加到它中，因为在中创建了不同的导航菜单wp我不希望它指向所有导航：D