导航下拉菜单被banner或flash覆盖(单遮住)解决办法（css法）

 

解决办法：

z-index和父标签(或者祖先)的position属性有关，比如a为下拉菜单的父标签，b为banner的父标签，a和b属于兄弟关系，
关系如下：
a > 下拉菜单
b > banner
此时这样设置css可以解决a下的元素被b下的banner遮罩的问题
a{position:relative;z-index:2},
b{position:relative;z-index:1}

 

下面附上这里我修改的样式：

 

<li class="mainlevel"><a href="news.php" title="新闻资讯">新闻资讯</a>
	<ul>
	<li><a href="news.php?tid=1" title="公司资讯">公司资讯</a></li>
	<li><a href="news.php?tid=2" title="行业资讯">行业资讯</a></li>
	</ul>
	</li>

 

<div class="bannerbg" >
<div class="ban">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="1440" height="420">
<param name="movie" value="swf/1.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<embed src="swf/1.swf" quality="high" wmode="transparent" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="1440" height="420"></embed>
</object>
</div>

#nav .mainlevel {float:left; height:57px; line-height:57px; width:97px; text-align:center; background:url(../images/navborder.png) left 13px no-repeat;position: relative;
z-index: 2;}

 

.bannerbg{background:url(../images/bannerbg.png) no-repeat center top; height:60px; _behavior: url(js/iepngfix.htc); padding-top:378px; position:relative; z-index:1}

 

 

转自：

view-source:http://www.webmaster5u.com/html/article_3225.html