当鼠标悬停在子菜单上时，使用CSS保持顶级导航悬停效果

Question

我想让顶层导航在悬停在子菜单项上时处于悬停状态。我读到我应该将悬停效应应用于李，但也有一些转折让我感到困惑。我无法弄清楚。有人能告诉我我需要调整的地方吗？

my jsfiddle

Answer 1

你会想要应用:hover影响到李和CSS适用于直接a孩子。将悬停应用到a将不起作用，因为顶级链接的子菜单不在a元素中。

ul#navigation .topNav:hover > a { 
    color:#acb453; 
    padding-top:0; 
    padding-bottom:10px; 
    border-bottom: 6px solid #4dbaf2; 
} 

http://jsfiddle.net/zwVwh/12/