悬停时更改下拉菜单的背景颜色答案

【问题标题】：Change background color of dropdown menu on hover悬停时更改下拉菜单的背景颜色
【发布时间】：2014-02-02 05:20:46
【问题描述】：

我正在尝试更改处于悬停状态的菜单的子菜单背景颜色。我尝试使用 firebug 来查找相关的 css 类，但只是部分成功。

如果您访问该网站 (http://www.yogaacademy.com.au/new/)，您会看到悬停时有灰色和黑色背景。我希望它是全黑的。

这是一个使用 woothemes 画布主题并进行了一些自定义的 wordpress 网站。 html（如下）是相当标准的，但我无法弄清楚相关 css 的确切来源：画布子主题中的 styles.css 和 css/ 和 custom.css。

您的帮助将不胜感激。

谢谢。

【问题讨论】：

标签： css wordpress drop-down-menu

【解决方案1】：

在 layout.css 第 211 行将背景颜色更改为黑色

#navigation ul.nav ul {
background: black; /*#e6e6e6 => black*/
left: -1px;
}

【讨论】：

【解决方案2】：

尝试删除“float:left;”来自 custom.css 第 143 行中的#main-nav li

#main-nav li {
 /* float: left; */

【讨论】：

【解决方案3】：

变化：

#navigation ul.nav ul {
background: #e6e6e6;
}

到

#navigation ul.nav ul {
background: #000000;
}

我认为这条 CSS 行来自：wp-content/themes/canvas/css/layout.css on line 211

干杯

【讨论】：

【解决方案4】：

转到那个子菜单类，然后输入以下代码：（假设它被称为子菜单）

child:hover { background-color:black}

【讨论】：

【解决方案5】：

**Try this code......**
Put in you style sheet.
#navigation ul.nav ul li:hover{
    background: #000000;
}

【讨论】：

【解决方案6】：

HTML

<div class="collapse navbar-collapse" id="myNav">
    <ul class="nav navbar-nav">
        <li><a href="index.php">Home</a></li>
        <li class="dropdown">
            <a  class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Resource<span class="caret"></span></a>
            <ul class="dropdown-menu">
                <li><a href="Finan.php">Financial</a></li>
                <li><a href="Real.php">Real Estate</a></li>
            </ul>
        </li>
    </ul>
</div>

CSS

#myNav ul.nav ul li a:hover{
    background: #000000;
}

【讨论】：