如何实现二级菜单的隐藏和显示？

Question

//一级菜单 <div class="shopClass1_item"> <dl class="shopClass_item1 shopClass_active"> <dt><a href="#">大家电</a></dt> <dd><a href="#">平板电视</a> <a href="#">空调</a> <a href="#">冰箱</a> <a href="#">洗衣机</a> <a href="#">热水器</a> <a href="#">消毒柜</a> <a href="#">冷柜</a> <a href="#">家庭影院</a></dd> </dl> //二级菜单 <div class="shopClass2_list"> <dl class="shopClass_list1"> <dt>电视影音</dt> <dd> <a href="#">平板电视</a> <a href="#">空调</a> <a href="#">冰箱</a> <a href="#">洗衣机</a> <a href="#">热水器</a> <a href="#">消毒柜</a> <a href="#">冷柜</a> <a href="#">家庭影院</a><a href="#">平板电视</a> <a href="#">空调</a> <a href="#">冰箱</a> <a href="#">洗衣机</a> <a href="#">热水器</a> <a href="#">消毒柜</a> <a href="#">冷柜</a> <a href="#">家庭影院</a><a href="#">空调</a> <a href="#">冰箱</a> <a href="#">洗衣机</a> <a href="#">热水器</a> <a href="#">消毒柜</a> <a href="#">冷柜</a> <a href="#">家庭影院</a></dd> </dl> .shopClass2_list{display:none;}这个是二级菜单。 .shopClass1_item dl:hover .shopClass2_list{display:block;} 我这样写实现不了，display:block;不能显示。该怎么办 想要的效果是：鼠标移到一级菜单，就显示二级菜单。

Answer 1

平级的你用css肯定不行，你要hover实现的话就把shopClass2_list的div放到dl下面

Answer 2

使用js去实现。鼠标移入和移出事件。

Answer 3

使用JQery更改你的HTML样式，

Answer 4

js控制~~

Answer 5

两个方案： 1 改造页面结构，2 使用js