悬停在子菜单中时菜单不会改变

Question

所以基本上我想让我的菜单在子菜单悬停时保持悬停状态， 我已经尝试过这样的

但它仍然不会像我想要的那样改变，我哪里出错了？ 这是我的sn-p

#topmenu li li:hover a:hover{
  color: #000;
  text-decoration: none;
  background-color: #fff;
  text-shadow: 0 0 1px #000; 
}

问候，

Answer 1

不知道为什么要用left: -999em; 而不是display: none; 隐藏子菜单。

这是一个更新的 jsFiddle：http://jsfiddle.net/JmkaM/1/，它使用 display: none; 和 display: block; 来显示子菜单。

您要做的是在用户悬停在顶级li 时显示子菜单。所以你会这样做li:hover ul。为您的特定 CSS 修改以下内容：

#topmenu li ul {
     /* left: -999em; remove */
     display: none;  /* add */
}

/* add the following */
#topmenu li:hover ul {
     display: block;
}

如果您出于某种原因确实需要使用left，请执行以下操作：

#topmenu li:hover ul {
     left: 0;
}

它会将您的子菜单从-999em 推到左侧。虽然它可能不会完全放在您想要的位置。

更新 1

这将是我最后一次帮助你。您需要了解良好的反馈会帮助其他人帮助您。我了解您是新来的，但在回答“不符合我的意愿”的回答时对我们或您没有帮助。

我只是根据您在 cmets 中链接到的 jsFiddle 来猜测您想要什么。

这是新的 jsFiddle：http://jsfiddle.net/JmkaM/2/

您将在下面看到我之前和之后所做的更改。为了简洁起见，我只突出显示了我更改的属性。

之前

#topmenu ul { /* ... */ }
#topmenu li ul {
     padding-top: 0px;
     padding-bottom: 0px;
}
#topmenu li li:first-child {
     margin-top: 14px;
     border: 0;
}

之后

/* added child selector '>' so only top level navigation
   items have a background of red */
#topmenu > ul { }
/* set padding on all sides to 0 */
#topmenu li ul {
     padding: 0;
}
/* removed whole rule - #topmenu li li:first-child */

更新 2

试试这个：

#topmenu > ul > li:hover {
    background-color: white;
}
#topmenu > ul > li:hover > a {
    color: black;
}

Answer 2

看到这个小提琴： http://jsfiddle.net/mSNqT/46/

这会很有帮助。