Heim  >  Artikel  >  Web-Frontend  >  2个div层 显示顺序问题_html/css_WEB-ITnose

2个div层 显示顺序问题_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-21 09:40:511182Durchsuche

.leftg1{top:0px;position:relative; z-index:1;}.tableindex{z-index:2;position:relative;}

想让tableindex 在leftg1上面  firefox  可以 ie 下面不行
如果 .leftg1 {top:0px;position:relative; z-index:-1;} 可以 但是 .leftg1 上面的元素不能编辑了 求解


回复讨论(解决方案)

leftg1 层是移动层

<div id="a">	<div id="a1" style="position:relative; z-index:2;">A-1 下拉层</div></div><div id="b" ><div id="b1"  style="position:relative;z-index:1;">B 上下滚动层</div></div>

是这个样子的

不用

XML/HTML code?123456

    
A-1 下拉层
B 上下滚动层
……
你这样的话 ,他俩永远不会覆盖啊

2个重回的时候就 遮盖了

就像这个页面  产品中心下拉 被左侧遮住了(ie 下遮住了 firefox 没有遮住)

对于IE浏览器的种种毛病我就不多说了,今天就说说在ie下如果设置了position:relative;后z-index就失效的问题,在做前端开发的时候Yovae我就被此问题纠缠过。
IE浏览器对于设置了position的元素会自动生成一个新的stacking context,导致 z-index被重置 为0,所以z-index才失效了。所以我们需要在这个元素的父元素上设置一个更高的z-index值。来消除这个影响。

参考:http://www.yovae.com/blog/ie%E7%9B%B8%E5%AF%B9%E5%AE%9A%E4%BD%8Dz-index%E5%A4%B1%E6%95%88%E9%97%AE%E9%A2%98.html

z-index:1写在html中

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn