最近做项目，经常遇到IE7以下浏览器中。一些悬浮框被一些元素遮挡的问题，这些元素一般都是设置了position的。问题的根本在不是被设置绝对定位的元素上，而是在设置了相对定位的父元素上。

 
我查阅了一些资料。当设置了相对定位的父元素如果没有设置z-index属性，当后面有元素设置position:relative的时候，则后面的元素就会遮挡掉前面的元素，不管前面的元素设置了多大的z-index
 
解决的方法我总结一下
 
1.对遮挡元素中设置z-index:0;初始化掉。
2.在被遮挡的父元素中，也就是设置了相对定位的元素中设置z-index属性，最好比遮挡元素要大一些。
 
 

在平时编写中，编写了position:relative后就要及时在后面设置z-index:0;如果有了这个意识，那以后的维护工作会相对轻松一些，这是我的个人看法。

IE6、7绝对定位层被遮挡的原因（主要是父层决定的）的更多相关文章

  1. 解决IE6 IE7绝对定位弹层被后面的元素遮住

    解决IE6 IE7绝对定位弹层被后面的元素遮住? 弹层边框一直被后面的元素边框遮住,试了n种方法,只有这个比较好用. <div class="tuijian-table"&g ...

  2. 关于IE6下绝对定位元素莫名消失的问题

    一般来说,让绝对定位的元素不挨着浮动元素就OK了: 1.当绝对定位层的邻近浮动层的宽度不等于父层宽度时,以及没有清除浮动时,IE6/7,FF中显示一致: 2.当绝对定位层的邻近浮动层的宽度不等于父层宽 ...

  3. 谷歌下解决Pop遮罩层无法遮挡滚动栏下问题

    今天用pop的弹出窗体里,出现一个问题,当网页出现滚动栏里,不能遮挡住,解决Pop遮罩层无法遮挡滚动栏下问题. 可通过下载获取改动后的代码----->进入下载

  4. jquery制作弹出层带遮罩效果，点击阴影部分层消失

    jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...

  5. layer子层给父层页面元素赋值，以达到向父层页面传值的效果

    父层: jsp中: //页面上添加一个隐藏的输入框待用于被子层设置value,从而将子层的数据传递到此页面 <input type="hidden" id="get ...

  6. controller层负责创建类传递类给service；service层负责逻辑编写调用dao层 将编写后的类传递到dao层，保证事务的正确性；dao层负责数据的持久化

    controller层负责创建类传递类给service:service层负责逻辑编写调用dao层 将编写后的类传递到dao层,保证事务的正确性:dao层负责数据的持久化

  7. js 冒泡事件阻止 父层事件影响子层

    当父层 与子层 有相同的事件时,但子层跟父层执行的内容却不一样时 为了 防止 父层事件对子层造成影响我们可以在子层的方法里做如下操作 function A (event){ event.stopPro ...

  8. ie6 ie7 绝对定位 相对定位 层被遮住

    relative 上加上z-index有多个,则z-index递减, absolute层显示则不会被其它标签挡住.

  9. IE6下绝对定位元素和浮动元素并列绝对定位元素消失

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. Session 类

     Session 类 Session 类可以使用户在浏览您的网站时,维持他们的状态并跟踪他们的行为. Session 类将每个用户的 session 信息序列化(serialize)后存储到到 coo ...

  2. hdu 4738 2013杭州赛区网络赛 桥+重边+连通判断 ***

    题意:有n座岛和m条桥,每条桥上有w个兵守着,现在要派不少于守桥的士兵数的人去炸桥,只能炸一条桥,使得这n座岛不连通,求最少要派多少人去. 处理重边 边在遍历的时候,第一个返回的一定是之前去的边,所以 ...

  3. Linux系统安装及初始化(ubuntu14.04)

    Windows 7下硬盘安装Ubuntu 14.04图文教程 Ubuntu 官方已经发布了正式版的 Ubuntu 14.04 LTS,并宣称这是为云计算准备的版本.该版本在云平台和伸缩环境的可靠性.性 ...

  4. 一种快速刷新richedit中内嵌动画的方法的实现

    在IM中使用动画表情是一种非常有趣的方式,然而选择一种合适的方式来实现却并不容易. 一般来说,除了自己去实现一个富文本控件,目前主要的解决方案有3种: 1.使用浏览器做容器. 2.使用QT提供的Ric ...

  5. Convert XML to Object using LINQ

    Class and Xml : Please see my another article. http://www.cnblogs.com/mingmingruyuedlut/p/3436803.ht ...

  6. Linux crontab 定时任务详解

    1.每小时执行一次脚本 * */1 * * * /etc/init.d/smb restart #不是所有的系统都支持“*/1”这种写法可以试试: 0 * * * * /etc/init.d/smb  ...

  7. string、math、random、datetime类

    1.string类 变量.Replace("想要替换掉的字符或字符串","转换后的字符或字符串");//替换 练习:判断邮箱格式是否正确            ...

  8. JMeter中的关联-正则表达式提取(1)

    运用Jmeter正则提取器,可以从请求的响应结果中取到需要的内容,从而实现关联. jmeter之关联 的个人理解: 关联是请求与请求之间存在数据依赖关系,需要从上一个请求获取下一个请求需要回传回去的数 ...

  9. Loadrunner中参数化实战（6）-Random+Each occurrence

    参数化数据30条: 脚本如下,演示登录,投资,退出操作是,打印手机号: 首先验证Vugen中迭代: Random+Each occurrence 设置迭代4次Action 结果如下:

  10. Angular JS学习之表达式

    1.Angular JS使用表达式把数据绑定到HTML: 2.Angular JS表达式写在双大括号中:{{expression}} **Angular JS表达式把数据绑定到HTML,这与ng-bi ...