当前位置: 代码迷 >> HTML/CSS >> 新手又有有关问题了,ie6层重叠有关问题,会的大神帮帮下…
  详细解决方案

新手又有有关问题了,ie6层重叠有关问题,会的大神帮帮下…

热度:102   发布时间:2012-04-08 14:38:30.0
新手又有问题了,ie6层重叠问题,会的大神帮帮下……
弄了个导航条,导航条有二级下拉菜单,现在的问题是,与导航条下拉重叠的那部分有点击链接,而在ie6中如果导航下拉的层放在顶部,那么下面的点击链接就会被遮住,点击不了,而如果放在下面,那些下拉信息又被点击链接遮住了,这个问题只有在ie6才会……不知道怎么弄啊……
导航部分代码:
  <td align="left" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
  <td width="10" align="left" valign="top"><img src="images/mdi1.gif" width="10" height="27" alt=""></td>
  <td width="653" align="left" valign="top">
   
  <div style="background-color:#ff00ff">
   
  <ul class="dropdown">
  <li><a href="about.aspx" class="linka" target="_parent"></a>
  <ul >
  <li><a href="about.aspx?type=1" style= "width:98px; height:19px;font-size:12px; vertical-align:middle; text-align:center;" target="_parent">公司简介</a></li>
  <li><a href="about.aspx?type=2" style= "width:98px; height:19px;font-size:12px;vertical-align:middle;" target="_parent">发展历程</a></li>
  <li><a href="about.aspx?type=3" style= "width:98px; height:19px;font-size:12px;vertical-align:middle;" target="_parent">组织架构</a></li>
 
  </ul>
  </li>
  </ul>

母板部分代码:
<table width="868" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  <td height="158" align="left" valign="top">
  <!-- 母板上端-->
  <div style=" position:absolute; z-index:1\0">
  <iframe src="top.aspx" name="tianle" width="868" marginwidth="0" height="358" marginheight="0" scrolling="No" frameborder="no" id="tianle" border="0" allowtransparency="ture"></iframe>
  </div>
  <!-- 母板上端-->
  </td>
  </tr>
  <tr>
  <td align="center" valign="top">
  <table width="847" border="0" cellpadding="0" cellspacing="0">
  <tr>
  <td width="847px">
   
  <div style ="position:absolute; ">
   
  <!-- 子页内容-->
<div class="doc-player doc-noads-player doc-player-tips" id="DocinViewer">
  <asp:contentplaceholder id="head" runat="server">
  </asp:contentplaceholder>
</div>
  <!-- 子页内容-->

截图:

红色的就是下拉区域了……

咋弄啊*.*

------解决方案--------------------
asp:contentplaceholder

最终生成到浏览器是怎么样的
------解决方案--------------------
无外乎div,z-index。如果出现覆盖,只要调整z-index即可。
特别注意的是如果子内容被遮盖,需将父标签或相对遮盖标签的父标签同级的z-index调整一下即可。
<div id=1>
<div>
<div id=3></div>
</div id=4>
</div>
<div id="2"></div>
id=1和id=2为同级,如果id3被id2覆盖,光调整id3的z-index是没有用的
,只要调整id1就可以了。
浮动菜单其实是position:relative包position:absolute,实现菜单的那样子。
  相关解决方案