码迷,mamicode.com
首页 > Web开发 > 详细

CSS z-index在ie67中不起作用

时间:2018-10-04 09:07:37      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:第一个   作用   技术   index   bsp   ie6   ati   relative   code   

在chrome浏览器中可以看到这样的效果:                        但是在ie67中看到的是:

技术分享图片                                技术分享图片

这是z-index在ie浏览器中的一个兼容性问题:

  一般来说z-index越大,层级越高,就会越在顶层显示,但是在ie67浏览器中会出现问题,

ie浏览器中会以他的顶级父元素作为参考点,不是以父元素作为参考,所以要在父元素中添加position:relative;z-index:1000(比被遮住的那一层高就行),这样在ie浏览器中就会正常显示了。

比如说:

<div style="position:relative;z-index:10">
    <div>
        <img style="position:absolute;z-index:10"/><!--此图片被下一个div遮住了,这是我们在第一个div中添加position:relative;z-index:10就可以解决问题-->
    </div>
</div>
<div></div><!--这个div在ie浏览器中吧上面那个img遮住了-->

 

CSS z-index在ie67中不起作用

标签:第一个   作用   技术   index   bsp   ie6   ati   relative   code   

原文地址:https://www.cnblogs.com/alex-xxc/p/9740715.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!