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

WBOY
發布: 2016-06-24 12:26:29
原創
1129 人瀏覽過

用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}


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

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板