欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

纯css多级菜单的解决办法_html/css_WEB-ITnose

程序员文章站 2023-12-30 12:25:40
...
用ul li做一个无限级下拉菜单

css写 #nav ul li ul{ display:none}
#nav ul li:hover ul{ display:bock}


这样的话鼠标悬停到一级菜单就会展开二级及它的三四五六七八九级全部子菜单
只好再写 #nav ul li:hover ul li ul{ display:none}

如果有几十级 岂不是要傻乎乎的写 #nav ul li ul li ul ... li:hover ul li ul以阻止鼠标悬停的下下级显示????

高手们如何解决这个问题呢

回复讨论(解决方案)

js来解决 纯css有兼容问题,毕竟hover 只有a在所有浏览器下支持

http://bbs.csdn.net/topics/390686370

http://jingyan.baidu.com/article/9f63fb91f5e897c8400f0e06.html 多级的CSS
http://www.wzsky.net/html/Website/CSS/113149.html

#nav li ul{ display:none}
#nav li:hover>ul{ display:bock}

#nav li ul{ display:none}
#nav li:hover>ul{ display:bock}


高手,一个 > 就解决问题。

上一篇:

下一篇: