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

悬停在li上时更改颜色

html-lists css-selectors wordpress css html

-1

Daan Seuntjens · 技术社区 · 5 年前

我正在编写一个简单的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 回复 | 直到 5 年前

jordanmannfeld 5 年前

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

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

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

rawnewdlz 5 年前

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

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

推荐文章

user9085934 · 居中列表元素

6 年前

Raymond N. · 仅当屏幕宽度>761px时,如何将响应导航栏扩展到100%宽度

6 年前

sdvnksv · 将列表项按50%的移位放在两行中

6 年前

Donald Roos · 显示列表项的随机选择并随机移动

6 年前

ET-CS · CSS-HTML列表-在页面中居中,左对齐LI项

6 年前

BobbyJones · 如何动态添加新选项卡?

6 年前

CSRenA · 如何使JavaScript创建的列表项可单击?

7 年前

alexpopa · css对齐元素,使它们之间具有相同的空间[重复]

7 年前

David Gomes · 使用自定义CSS内容处理列表项内的段落

7 年前

Edon · 角度2中带有箭头键的html列表项选择

7 年前