z-index不起作用的大坑

加500行埋点是不是会占用你一天的时间而且很容易犯错,如果你想只用一小时准确加完这500行埋点剩下一天喝茶聊天来试试这520工具,高效加埋点,目前我们公司100号前端都在用

http://www.520webtool.com/

自己开发所以免费,里面有使用视频

其实原理也很简单,就是利用了z-index的覆盖问题,在写的过程中我发现无论怎么改变,insert的z-index总是无效的,于是百度了一下z-index无效的情况,一共有三种:
1、父标签 position属性为relative;

2、问题标签无position属性(不包括static);

3、问题标签含有浮动(float)属性。

这样也很好理解为什么parent设置了position和z-index之后insert的z-index就会失效的问题了,他的解决办法有是三个:


1、position:relative改为position:absolute;

2、浮动元素添加position属性(如relative,absolute等);

3、去除浮动。

所以,去掉parent的position和z-index,达到了我想要的效果,如下图所示:
————————————————
版权声明:本文为CSDN博主「瞬间空白sky」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/apple_01150525/article/details/76546367

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页