web 下ie6 select无法被div遮盖的解决

使用div制作蒙版或模拟弹出窗口，但在IE6下，当div下方有下拉列表框select元素的时候，下拉列表框会划破div显示在div之上，不论z-index设为何值均会出现此问题，可能由于下拉列表控件的弹出式下拉列表的原因导致Z轴高度失控。但是IE6有一个神奇的逻辑，div 无法覆盖select,但是iframe 可以覆盖select，而div可以覆盖iframe，所以解决办法就是用Z轴高度更高的Iframe元素，包裹或覆盖住下拉列表框控件，使其回到正常的Z轴高度上来！

html如下:

Html代码
<div id="acontainnerbox" class="aboxinitcss">  
这里是很多代码,[url=www.k686.com]www.k686.com[/url]       
<iframe class="ifhideselect" frameborder="0"></iframe>  
</div>  
<div id="acontainnerbox" class="aboxinitcss">
这里是很多IC报价网代码,[url=www.k686.com]www.k686.com[/url] 
<iframe class="ifhideselect" frameborder="0"></iframe>
</div>

css代码如下:

Html代码
.aboxinitcss{   
    position:absolute;   
    margin-top:0px;   
    margin-left:0px;   
    display:none;   
    background:#FFF;   
    border:solid #CCC 1px;   
    padding:30px;   
    z-index:9999;   
    width:620px;overflow:hidden;   
}   
.ifhideselect{   
z-index:-1;   
width:680px;   
height:255px;   
position:absolute;   
border:0;   
left:0;   
top:0;   
}  
.aboxinitcss{
 position:absolute;
 margin-top:0px;
 margin-left:0px;
 display:none;
 background:#FFF;
 border:solid #CCC 1px;
 padding:30px;
 z-index:9999;
 width:620px;overflow:hidden;
}
.ifhideselect{
z-index:-1;
width:680px;
height:255px;
position:absolute;
border:0;
left:0;
top:0;
}

即可解决IC报价网这个bug.
iframe的z-index一定要设置为负数,不然遮盖不住.

转载于:https://www.cnblogs.com/codeaspnet/archive/2011/06/17/2083881.html