jquery - 大型下拉菜单背景悬停问题

Question

我在我的网站上使用 CSS3 Mega Drop Down Menu 来创建菜单栏。我使用了 nodrop 的 li ID 来阻止页面上的“Home”链接创建下拉菜单背景:

<ul class="menu"><!-- BEGIN MENU -->

   <li id="nodrop"><a href="http://www.eco-fireplaces.co.uk">Home</a></li>

     <li><a href="" class="drop">Fireplaces</a><!-- Begin 1 column Item -->

        <div class="dropdown_1column"><!-- Begin 1 column container -->

            <div class="col_1 firstcolumn">

                <ul class="levels">

                    <li><a href="#">FreelanceSwitch</a></li>

                    <li><a href="#" class="parent">Creattica</a>
                        <ul>

nodrop“主页”链接的 CSS:

.menu li#nodrop {
    z-index:2;
    float:left;
    text-align:center;
    position:relative;
    padding: 4px 10px 4px 10px;
    margin-right:30px;
    margin-top:7px;
    background:none;
    border:none;
}

出于某种原因，“主页”链接的颜色仍然变为白色，使其在页面背景上不可见(因为它也是白色的)。我认为问题出在此处的 CSS 文件中:

.menu li:hover a {
    color:#ffffff;
    text-shadow: none;
}

上面的“Fireplaces”链接工作正常，但如何让“Home”链接变为绿色？

我是否必须将 li ID #nodrop 包含到 .menu li:hover a CSS 中，如果是，我该怎么做那个？

非常感谢任何帮助和建议。

您可以在我的网页上看到一个主页链接消失的例子(见下面的链接)

链接到我的网站> http://www.eco-fireplaces.co.uk/fireplaces.html

Answer 1

是的，你也必须包括 Div 的 ID，因为

li#nodrop:hover a
{
color:green;
text-shadow: none;
}

尝试在你的 css 文件中设置上面的类并检查它是否有效。

谢谢 普拉尚