Question

当鼠标悬停时，我需要将下拉菜单项的颜色更改为蓝色；当鼠标悬停在项目上时，我需要将颜色从蓝色更改为黑色，请看下面的图片： https://ibb.co/5ss9YfC

如果您需要检查详细信息，请使用模拟帐户登录并检查： http://116.202.31.216/gps/ 电子邮件：演示密码：演示

我认为这是我想要更改悬停颜色的元素的代码，因此我可以在此处插入以更改颜色：

.x-menu-item {
    white-space: nowrap;
    overflow: hidden;
    border-color: black;
    border-style: solid;
    background-color: black!important;
}

Answer 1

您可以在CSS中使用:hover类。

.x-menu-item:hover {
    color: blue;
}

详细了解：hover here

Answer 2

如果这不能回答您的查询，那么您可以详细说明您要寻找的结果。

根据您的问题，以下方法可以解决问题

.x-menu-item:hover {
cursor:pointer;
color: #preferedcolorHexcode;
background:#preferedcolorHexcode;
}

希望这有助于回答您的查询。

Answer 3

使用:hover和background-color，如下所示：

.x-menu-item {
  background-color: #000000;
}

Answer 4

您需要更改以下CSS：

.x-menu-item-default.x-menu-item-focus, .x-menu-item-default.x-menu-item-active {
    background-image: none;
    background-color: #7fb5e4;
}

到

.x-menu-item-default.x-menu-item-focus, .x-menu-item-default.x-menu-item-active {
    background-image: none;
    background-color: #000;
}

我希望这会有所帮助。

Answer 5

希望以下提到的代码将对您有所帮助。

.x-menu-item:hover {
   background-color:#000000;
} 
or
.x-menu-item:hover,
.x-menu-item:focus,
.x-menu-item:focus:hover,
.x-menu-item:active:hover {
   background-color:#000000;
}

更改下拉菜单项的颜色

5 个答案: