Html 问题更改每个li项目的悬停颜色

这是参考链接：

这是wordpress的主题。我编辑css是因为我想更改每个菜单项的悬停颜色。这是我一直在尝试的代码

#menu-item-43 a:hover {background-color: rgb(161, 204, 58) !important;}

• 问题是相同的方法在其他项目中不起作用。为什么?
• 然后我尝试使用css3nth元素来选择我想要的特定li项。下面是一个例子

   #topnav li:nth(4) a:hover {background-color:black;}
  

---

上述方法也不起作用。如何更改每个菜单项的颜色？提前感谢

这可能与您试图更改颜色的链接的特殊性有关。如果您不熟悉css特性，这里有一个很好的参考：

---

基本上，CSS是根据元素的特殊性应用于DOM中的元素的，因此您尝试使用选择器和内联等应用CSS的方式。。对哪些元素实际应用了CSS有影响。

查看用于为

元素提供背景色的选择器：

#topnav li.current-menu-item > a, #topnav li.sfHover > a, #topnav li a:hover

您的选择器必须更加具体，并且

#菜单项-43 a:hover

将无法满足要求。为什么不试试：

#menu-item-43 > a, #menu-item-43 > a:hover { ... }

---

如果您使用的是可重复项，如

菜单项

，则应使用类。当您使用

#

时，您是通过id选择元素，该id对于整个文档来说应该是唯一的。在某些情况下，选择器仅选择与id匹配的第一个项目，因为它应该是唯一的

例如：

#

表示您正在引用一个

id

，并且每个页面只能使用一次<代码>表示您引用的是可重用的

类。没有“n（n）”选择器。有第n个孩子（n）。
.menu-item a:hover { background-color: rgb(161, 204, 58) !important;} }