css下拉菜单

<li class="drop">
<a href="">
帮助中心
<em class="arrow"></em>
</a>
<ul class="down">
<li class="erji"><a href="">买家服务</a></li>
<li class="erji"><a href="">商家服务</a></li>
<li class="erji"><a href="">规则中心</a></li>
</ul>
</li>

样式部分：

#M_PC_top_nav .inner .down{display: none;}
#M_PC_top_nav .inner .drop:hover .down{display: block;}（可理解为A:hover  .B {display:block;} ,B包裹着下拉的li,A包裹着B）
#M_PC_top_nav .inner .drop ul li{float: none;}

 float:none使下拉菜单显示时竖着排列 ！

新bug !!!

当鼠标移“下载APP”时，会出现下拉菜单，但如果此处相对定位和绝对定位设置不好（如都设为relative），会造成一旦下拉菜单display=none时，最后两个块，也就是”下载App“和”帮助中心“会移到“美丽说会员”那里，重叠在一起，当把下拉菜单设置为relative,而后两个块设置为absolute时。问题就解决了，至于原理，日后有待分解。

转载于:https://www.cnblogs.com/Isabel4u/p/6835762.html