小编use*_*093的帖子

在mouseout后保持子菜单处于活动状态

当用户将鼠标悬停在水平菜单上时,如何保持子菜单打开,直到另一个菜单项悬停在上面?这是源代码:

HTML

 <ul id="nav">
   <li><a href="/">Home</a></li>
   <li><a href="#">my Links</a>
     <ul>
       <li><a href="Link1">Link 1</a></li>
       <li><a href="Link2">Link 2</a></li>
     </ul>
   </li>
 </ul>    
Run Code Online (Sandbox Code Playgroud)

CSS

#nav {
    width:100%;
    margin:0;
    padding:12px 0 4px 0;
    height:30px;
    position:relative;
}
#nav li {
    float:left;
    list-style:none;
    display:inline
}
#nav a {
    text-decoration:none;
}
#nav li ul li a {
    margin:0
}
#nav .active a, #nav li:hover>a {
    background:#ac2024;
    color:#fff;
}
#nav li a:hover, #nav ul a:hover {
    background:#ac2024;
    color:#fff
}
#nav ul {
    position:absolute;
    left:0;
    height:27px;
    width:100%;
    display:none;
}
#nav …
Run Code Online (Sandbox Code Playgroud)

html css menu hover nav

-12
推荐指数
1
解决办法
1549
查看次数

标签 统计

css ×1

hover ×1

html ×1

menu ×1

nav ×1