我用CSS+DIV做了导航条,但是在鼠标移上有下拉滑出菜单的内容的时候,把下面的内容挤占了下去。在CSS里面,我已经指定了菜单的位置,也用了z-index,hover用了block;但是还是不起作用
.wjs_nav{width:1200px; height:38px; position:relative;z-index:9999;}
.wjs_nav ul{margin-left:110px;}
.wjs_nav ul li{float:left; font-size:16px; font-weight:bold; line-height:48px;letter-spacing:1px; text-align:center; color:#505050; font-family:"Microsoft YaHei";}
.wjs_nav ul li a{color:#505050;}
.wjs_nav ul li a:hover{color:#cf000d}
.wjs_nav li:hover ul, li.over ul {display: block;}
<div class="wjs_nav" >
<ul id="nav">
<li><a href="${base}/">首 页</a> | </li>
<li><a href="${base}/xhjj/index.htm">关于我们</a> |
<ul>
<li><a href="${base}/xhjj/index.htm">学会简介</a></li>
<li><a href="${base}/zzjg/index.htm">组织机构</a></li>
<li><a href="${base}/dsj/index.htm">大事记</a></li>
<li><a href="${base}/lxwm/index.htm">联系我们</a></li>
</ul>
</li>
<li ><a href="${base}/xhzc/index.htm">学会章程</a> |
</li>
<li><a href="${base}/xwzx/index.htm">新闻资讯</a> |
<ul>
<li><a href="${base}/xhxw/index.htm">学会新闻</a></li>
<li><a href="${base}/tzgg/index.htm">通知公告</a></li>
</ul>
</li>
<li><a href="${base}/hdyg/index.htm">学会活动</a> | </li>
<li><a href="${base}/mjtj/index.htm">名家推荐</a> |
</li>
<li><a href="${base}/zpzs/index.htm">作品展示</a> |
</li>
<li><a href="${base}/yspdazx/index.htm">艺术品档案中心</a> |
</li>
<li ><a href="${base}/hzhb/index.htm">合作伙伴</a>
</li>
</ul>
</div>
  |
|