Home > Web Front-end > HTML Tutorial > How to use ul li ul li ul li in css to implement a three-level menu_html/css_WEB-ITnose

How to use ul li ul li ul li in css to implement a three-level menu_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:24:56
Original
2059 people have browsed it

css





多级菜单









At present, when the second-level menu is displayed, the third-level menu is also displayed. I don’t know what went wrong. Please Expert guidance, thank you in advance...

The file has been uploaded to: http://www.zjgqy.com.cn/t4.html

Reply to the discussion (solution)

#menu2 ul li:hover ul li ul{   display:none;}
Copy after login
Copy after login

Add this, otherwise the third level ul will be displayed when the second episode menu is displayed

#menu2 ul li:hover ul li ul{   display:none;}
Copy after login
Copy after login

Add this, otherwise the second episode When the menu is displayed, the third level ul will be displayed together


Thanks to Dizzy88 for the reply, this problem is solved, but there is still a problem under IE6, I don’t know what to do! Could you please help me take another look?

#menu2 ul li.current ul{
display:block;}
Added this style, and the following JS

This IE6 does not support that sentence, it only supports the pseudo-class of a! Does this require changing JS?

This must be a problem with the JS code. One sentence is right. IE6 does not support pseudo classes, so the sentence you added later to hide the three-level list is also invalid. You should give it in JS. Plus no display!

Because the third-level menu is not hidden when the mouse moves to the second-level menu
As long as the