为什么背景 CSS 颜色不会保持悬停？

【问题标题】：Why won't background CSS color stay on hover?为什么背景 CSS 颜色不会保持悬停？
【发布时间】：2015-06-09 15:05:32
【问题描述】：

在dev site 上，如果您将鼠标悬停在主菜单中的“品牌”上，它会弹出一个下拉菜单。将鼠标悬停在其中任何一个上，背景闪烁红色，然后消失。

我像这样在主菜单的“li”和“a”元素中添加了背景 CSS...

.mega-dropdown-inner  ul.level1 li.open:hover{
background: red !important;
}
.mega-dropdown-inner  ul.level1 li a:hover{
background: red;
}

注意：我认为我什至不需要“a”样式，但只是尝试了一下以防万一。

知道为什么背景颜色不会在您悬停的整个过程中保持不变吗？

【问题讨论】：

那是因为你的所有anchor 标签上都有一个transition。

标签： html css

【解决方案1】：

因为这条规则

.t3-megamenu .mega-nav > li a:hover, .t3-megamenu .dropdown-menu .mega-nav > li a:hover, .t3-megamenu .mega-nav > li a:focus, .t3-megamenu .dropdown-menu .mega-nav > li a:focus {
   background-color: #002d5c !important; 
}

在您的 custom.css 第 1031 行中。

它覆盖了你的规则

【讨论】：

@JeffNoel 答案并不是建议使用important，只是说明它正在被使用并且它是问题的根源。不确定您是否收集了这些信息，或者只是在哪里进行了整体评论。
@JeffNoel 我不同意你的观点。我不是建议 OP 使用!important 我只是指出问题
@laaposto 我完全误解了你的第一条评论，我认为 其他人 不理解你的答案，我试图向他们解释，但这是你在与否决者交谈。对此感到抱歉
我删除了该代码并且它有效，所以这显然是正确的答案（不知道为什么它被否决），谢谢！