嗨我的suckerfish菜单有问题，我似乎无法弄清楚当鼠标悬停在它的下拉菜单上时如何保持顶级菜单项突出显示。弹出菜单......
这是CSS：
#mainnav, #mainnav ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}
div#mainnav ul {display:block;float:left;margin:0;padding:0;width:640px;margin-top:70px;}
div#mainnav ul li.level1 a {
display:block;
height:40px;
padding:0 12px;
width:auto;
font: 16px ChunkFiveRegular, serif;
line-height:43px;
}
.level1.active a, .level1 a:hover {color:#fcba2b !important;background-color:#4777ba;}
#mainnav li.level1 a:visited {color:#1b4a7e;}
div#mainnav ul li.level2 a {
display:block;
height:auto;
padding:3px 12px;
width:176px;
font: 14px/16px Arial, Helvetica, sans-serif;
color:#ffffff !important;
}
.level1.active a, .level2 a:hover {color:#fcba2b !important;background-color:#4777ba;}
#mainnav li.level2 a:visited {color:#1b4a7e;}
#mainnav li { /* all list items */
float: left;
}
li.level2 a:hover {background-color:#1b4a7e;color:#ffffff !important;}
#mainnav li ul { /* second-level lists */
margin-top:auto;
position: absolute;
background:#4777ba;
width: 200px;
left: -9999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
#mainnav li ul ul { /* third-and-above-level lists */
margin: -22px 0 0 200px;
}
#mainnav li:hover ul ul, #mainnav li:hover ul ul ul, #mainnav li.sfhover ul ul, #mainnav li.sfhover ul ul ul {
left: -9999em;
}
#mainnav li:hover ul, #mainnav li li:hover ul, #mainnav li li li:hover ul, #mainnav li.sfhover ul, #mainnav li li.sfhover ul, #mainnav li li li.sfhover ul { /* lists nested under hovered list items */
left: auto;
}
这是html：
<div id="mainnav">
<ul >
<li class="first level1"><a href="http://edukids.bigblock.ca/" title="Home" ><span>Home</span></a></li>
<li class="level1 active"><a href="http://edukids.bigblock.ca/index.php?id=15" title="Locations" ><span>Locations</span></a>
<ul >
<li class="first level2"><a href="index.php?id=8" title="Ajax" ><span>Ajax</span></a>
<ul >
<li class="first level3"><a href="index.php?id=41" title="EduKids King's Crescent" ><span>EduKids King's Crescent</span></a></li>
<li class="level3"><a href="index.php?id=36" title="EduKids Salem Road" ><span>EduKids Salem Road</span></a></li>
<li class="last level3"><a href="index.php?id=44" title="St. George's Daycare Centre" ><span>St. George's Daycare Centre</span></a></li>
</ul>
</li>
<li class="level2 active"><a href="index.php?id=9" title="Pickering" ><span>Pickering</span></a>
<ul >
<li class="first level3 active"><a href="index.php?id=15" title="EduKids Altona Road" ><span>EduKids Altona Road</span></a></li>
<li class="level3"><a href="index.php?id=16" title="EduKids Glenanna Road" ><span>EduKids Glenanna Road</span></a></li>
<li class="level3"><a href="index.php?id=17" title="Discovery Place Child Care" ><span>Discovery Place Child Care</span></a></li>
<li class="last level3"><a href="index.php?id=18" title="St. Paul's Child Care Centre" ><span>St. Paul's Child Care Centre</span></a></li>
</ul>
</li>
<li class="level2"><a href="index.php?id=10" title="Newmarket/Stouffville" ><span>Newmarket/Stouffville</span></a>
<ul >
<li class="first level3"><a href="index.php?id=45" title="The Moppett School" ><span>The Moppett School</span></a></li>
<li class="last level3"><a href="index.php?id=46" title="Christ Church Child Care Centre" ><span>Christ Church Child Care Centre</span></a></li>
</ul>
</li>
<li class="level2"><a href="index.php?id=11" title="North York" ><span>North York</span></a>
<ul >
<li class="first level3"><a href="index.php?id=47" title="Yonge-Churchill Child Care Centre" ><span>Yonge-Churchill Child Care Centre</span></a></li>
</ul>
</li>
<li class="level2"><a href="index.php?id=12" title="Simcoe" ><span>Simcoe</span></a>
<ul >
<li class="first level3"><a href="index.php?id=48" title="EduKids Bradford" ><span>EduKids Bradford</span></a></li>
</ul>
</li>
<li class="level2"><a href="index.php?id=13" title="Toronto/Scarborough" ><span>Toronto/Scarborough</span></a>
<ul >
<li class="first level3"><a href="index.php?id=49" title="Children's Village One" ><span>Children's Village One</span></a></li>
<li class="level3"><a href="index.php?id=50" title="Children's Village Three" ><span>Children's Village Three</span></a></li>
<li class="level3"><a href="index.php?id=51" title="Don Mills Child Care Centre" ><span>Don Mills Child Care Centre</span></a></li>
<li class="last level3"><a href="index.php?id=52" title="York Mills Child Care Centre" ><span>York Mills Child Care Centre</span></a></li>
</ul>
</li>
<li class="last level2"><a href="index.php?id=14" title="Whitby/Brooklin" ><span>Whitby/Brooklin</span></a>
<ul >
<li class="first level3"><a href="index.php?id=53" title="EduKids Dundas Street" ><span>EduKids Dundas Street</span></a></li>
<li class="level3"><a href="index.php?id=54" title="Castleview Child Care Centre" ><span>Castleview Child Care Centre</span></a></li>
<li class="last level3"><a href="index.php?id=55" title="St. Thomas' Child Care Centre" ><span>St. Thomas' Child Care Centre</span></a></li>
</ul>
</li>
</ul>
</li>
<li class="level1"><a href="index.php?id=4" title="About Us" ><span>About Us</span></a></li>
<li class="level1"><a href="index.php?id=19" title="Programs" ><span>Programs</span></a>
<ul >
<li class="first level2"><a href="index.php?id=19" title="Infant/Toddler" ><span>Infant/Toddler</span></a></li>
<li class="level2"><a href="index.php?id=20" title="Pre-School/Kindergarten" ><span>Pre-School/Kindergarten</span></a></li>
<li class="last level2"><a href="index.php?id=21" title="School Age" ><span>School Age</span></a></li>
</ul>
</li>
<li class="level1"><a href="index.php?id=6" title="Careers" ><span>Careers</span></a></li>
<li class="last level1"><a href="index.php?id=7" title="Info Request/Contact" ><span>Info Request/Contact</span></a></li>
</ul>
</div>
有什么想法吗？
答案 0 :(得分：0)
这：
.level1 a:hover
需要这样：
.level1:hover a
原因是ul不是a标记的子代，您有:hover。因此，当您翻转ul时a失去焦点，因此失去悬停状态