代码之家 › 专栏 › 技术社区 › Daan Seuntjens

悬停在li上时更改颜色

html-lists css-selectors wordpress css html

-1

Daan Seuntjens · 技术社区 · 6 年前

我正在编写一个简单的WordPress页面,当鼠标悬停在它上面时,我想更改菜单栏(右上角)的背景色。在这个网站上: https://www.happylogo.be/ . 我通常只使用“添加额外的CSS”,它只是一个CSS文件。奇怪的是,我认为我的选择代码是正确的,因为当我添加“visibility:hidden;”时,它会迅速消失,当悬停在li项上时,它会再次出现。

我现在使用的CSS代码:

#menu-primary-coach li:hover{
   /*#menu-primary-coach is the id of the lu*/
   background-color: #c7143a !important;
}

但它不起作用。当鼠标悬停在菜单项上时,如何更改背景色?

2 回复 | 直到 6 年前

1

jordanmannfeld 6 年前

我注意到了 <a> 在您的 <li> 实际上是用黑色覆盖悬停状态。

#primary-nav ul li:hover > a, #sticky_menu li:hover > a {
    background-color: #000000;
}

您可以删除此样式,也可以设置 <A & GT; 到你想要的颜色。

2

1

rawnewdlz 6 年前

它是由这行CSS引起的。有一个悬停在 <a> 内 <li> . 由于页面使用的是XHTML,所以悬停样式应该位于 <A & GT; 而不是 <理工大学; . 如果您使用HTML5,它可以在 <理工大学; .

#primary-nav ul li:hover > a, #sticky_menu li:hover > a {
    background-color: #000000;
}