Css 下拉列表中的顶级菜单项

我有一个完全用CSS制作的下拉菜单（没有JS）。我希望当我在它的下拉菜单上悬停时，顶层菜单项保持高亮显示，但我不知道怎么做

这里有一个我所说的例子：当你把光标放在下拉菜单上时，顶层的项目会回到默认颜色

有人能帮忙吗？CSS中有没有一条规则可以解决这个问题

以下是CSS：

nav {
    z-index: 10001;
    position: relative;
    display: block;
    width: 100%;
    height: 45px;
    text-transform: uppercase;
    border-bottom: 1px solid white;
    color: white;
    text-shadow: none;
    text-align: center
}
nav a {
    text-decoration: none
}
#topmenu {
    position: relative;
    text-align: left;
    left: 2%
}
nav ul {
    white-space: nowrap;
    list-style: none;
    position: relative;
    display: inline-block
}
nav ul ul {
    visibility: hidden;
    opacity: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    transition: opacity .3s linear,visibility .3s linear;
    -webkit-transition: opacity .3s linear,visibility .3s linear;
    -moz-transition: opacity .3s linear,visibility .3s linear;
    -o-transition: opacity .3s linear,visibility .3s linear
}
nav ul ul li: last-child {
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom: 1px solid #afafaf
}
nav ul li a: hover {
    padding: 13px 20px;
    color: green
}
nav ul ul {
    padding: 0;
    position: absolute
}
nav ul ul li {
    float: none;
    position: relative;
    border: 1px solid #afafaf;
    border-bottom: 1px solid #b7b7b7;
    border-top: 1px solid #fff;
    background: -webkit-linear-gradient(#eee 0,#d4d4d4 100%);
    background: linear-gradient(#eee 0,#d4d4d4 100%);
    background: -moz-linear-gradient(#eee 0,#d4d4d4 100%);
    background: -o-linear-gradient(#eee 0,#d4d4d4 100%);
    -moz-box-shadow: inset 2px 2px 5px #ccc;
    -webkit-box-shadow: inset 2px 2px 5px #ccc;
    box-shadow: inset 2px 2px 5px #ccc;
    filter: progid: DXImageTransform.Microsoft.Shadow(color=#ccc,Direction=134,Strength=5);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee',endColorstr='#d4d4d4')
}
nav ul ul li a {
    padding: 13px 20px;
    color: #063058
}
nav ul li: hover>ul {
    visibility: visible;
    opacity: 1;
    -moz-opacity: 1;
    -webkit-opacity: 1
}
nav ul li {
    float: left
}
#topmenu li a: hover {
    color: #fff
}
#topmenu li a: hover {
    color: green;
    background: -webkit-linear-gradient(#eee 0,#d4d4d4 100%);
    background: linear-gradient(#eee 0,#d4d4d4 100%);
    background: -moz-linear-gradient(#eee 0,#d4d4d4 100%);
    -moz-box-shadow: inset 2px 2px 5px #ccc;
    -webkit-box-shadow: inset 2px 2px 5px #ccc;
    box-shadow: inset 2px 2px 5px #ccc;
    filter: progid: DXImageTransform.Microsoft.Shadow(color=#ccc,Direction=134,Strength=5);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee',endColorstr='#d4d4d4')
}
nav ul li a {
    display: block;
    padding: 13px 20px;
    color: white
}
nav ul ul ul {
    position: absolute;
    left: 100%;
    top: 0
}

---

我无法加载你的网站，所以我刚刚为你做了这把小提琴，上面有很多关于CSS的评论 我为你做了这把小提琴

这很有效

#topmenu li:hover a { background: linear-gradient(#EEEEEE 0px, #D4D4D4 100%) repeat scroll 0 0 transparent; box-shadow: 2px 2px 5px #CCCCCC inset; color: green; } #topmenu li：将鼠标悬停在a上{ 背景：线性渐变（#EEEEEE 0px，#d4 100%）重复滚动0 0透明； 盒影：2×2×5×中交插页； 颜色：绿色； }

---

我刚把你的代码复制到那里。

你的HTML不见了。尝试在jsfiddle之类的东西中建立一个工作示例，我很乐意演示它是如何完成的。不应该太难，我尝试过（），但在JSFIDLE中不起作用，这就是为什么我给了网站一个直接的url:（这确实起作用，谢谢--只需在悬停时修复下拉项的颜色。你们太棒了，谢谢你们的帮助--这已经困扰了我好几个星期了！ #topmenu li:hover a { background: linear-gradient(#EEEEEE 0px, #D4D4D4 100%) repeat scroll 0 0 transparent; box-shadow: 2px 2px 5px #CCCCCC inset; color: green; }