CSS 在悬停时更改引导下拉菜单的背景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21854138/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Changing the background for bootstrap dropdown a on hover
提问by yuvi
I am using bootstrap's dropdown from a navigation div, and I'd like to change the color of the the sub-menulinks on hover. Nothing I'm attempting works, and I can't make sense of it. It's not having any effect even when trying to run things from the chrome console.
我正在使用导航 div 中的引导程序下拉菜单，我想更改悬停时子菜单链接的颜色。我正在尝试的任何东西都不起作用，我无法理解。即使尝试从 chrome 控制台运行，它也没有任何效果。
I have created a css file where I override the defaults. The background change for normal atags work, but the hover doesn't. Why is that? I also tried affecting the liand using !important, but none of that is having any effect.
我创建了一个 css 文件，我在其中覆盖了默认值。普通a标签的背景更改有效，但悬停无效。这是为什么？我也尝试影响li和 使用!important，但没有任何影响。
I'm using Bootstrap 3.1.1. Here's my css:
我正在使用 Bootstrap 3.1.1。这是我的CSS：
.dropdown-menu > li > a {
color: white; /* This has an effect */
}
.dropdown-menu > li > a:hover {
background-color: red; /* This doesn't... why? */
}
And check out this jsfiddletoo for a demonstration (for some reason you need to drag the result panel a whole lot to the left before you see the button). Any ideas?
并查看此jsfiddle进行演示（出于某种原因，您需要在看到按钮之前将结果面板向左拖动很多）。有任何想法吗？
edit
编辑
Note I am trying to change the background color for the links inthe dropdown, not for the main button which is MyProfile.
请注意我试图更改链接的背景色中的下拉列表中，不包括主键是MyProfile。
回答by Nit
Bootstrap defines a background imagefor the elements to override some clashes in their media queries. Remove the image to use a simple fill color.
Bootstrap为元素定义了背景图像以覆盖其媒体查询中的某些冲突。删除图像以使用简单的填充颜色。
You can redefine your hover as follows:
您可以按如下方式重新定义悬停：
.dropdown-menu > li > a:hover {
background-color: red;
background-image: none;
}
