css被遮挡的绝对定位
来源：aliued.com 发布时间：2008-02-29 12:00:00
标签：定位,css,div
<div class=”A” style=”position:relative;”>A (relative)
<div class=”logo” style=”position:absolute;z-index:99999;“></div>
</div>
<div class=”B” style=”position:relative;”>B (relative)</div>
最近做minisite项目时，碰到了个奇怪的定位问题: 以上的A，B两个盒子是相对定位,
标牌logo是A的子级，基于A做绝对定位
问题描述：我们希望标牌logo显示在最上面，但在IE下logo标牌部分被B区域遮住,B在最上层显示，调整logo的z-index的数值调整无效，firefox下显示正常。
解决方案：先了解一下所涉及到的几个定位特性（非官方解释）：
1. 相对定位元素默认的z-index的数值是0。
2. 当两个相对定位同时出现时，代码靠后的z-index优先。
3. 子级遵循父级设定的z-index；如果子级设定了绝对定位、z-index，可以冲破父级显示
这个问题主要是ie对上面第3条错误解释导致的—在ie下子级的z-index不能冲破父级。网上解决这个bug的办法一般用hack使B为负值，来降低 B 在IE下级别，这种方法绕了一个大圈：z-index为负值时，产生了新的ie bug。
按照定位的特性，ie的这个bug是可以回避的，从表面上看 B 遮住了logo，实际上是 B 遮住了logo的父级 A ，只要将 A 的z-index设定大于B即可。
<div class=”A” style=”position:relative;z-index:1;“>A (relative)
<div class=”logo” style=”position:absolute;”></div>
</div>
<div class=”B” style=”position:relative;”>B (relative)</div>
0
投稿猜你喜欢
PyQt5 Qt Designer (Qt设计师)PyQt5是对Qt所有类进行封装, Qt能开发的东西, PyQt都能开发.Qt是强大的GU- 调用很简单 Readkid.motion.tween(target,duration, vars)target: 要缓动的DOM对象dura
- 一、引用返回引用返回用在当想用函数找到引用应该被绑定在哪一个变量上面时。不要用返回引用来增加性能，引擎足够聪明来自己进行优化。仅在有合理的技
- 本文实例讲述了python使用pil生成缩略图的方法。分享给大家供大家参考。具体分析如下：这段代码实现python通过pil生成缩略图的功能
- 一个功能的实现，可以用多种语句来实现，比如说:while语句、for语句、生成器、列表推导、内置函数等实现，然而他们的效率并不一样。写了一个
- 1 如何在网页中获取 JSON 数据？打开一个具有动态渲染的网页，按 F12 打开浏览器开发工具，点击“网络&r
- 前言：并行编程比程序编程困难，除非正常编程需要创建大量数据，计算耗时太长，物理行为模拟困难例子：N体问题物理前提：牛顿定律时间离散运动方程普
- 引言skimage提供了io模块，顾名思义，这个模块是用来图片输入输出操作的。为了方便练习，也提供一个data模块，里面嵌套了一些示例图片，
- 什么是 JScript？JScript 是由微软开发的活动脚本语言，基于 ECMAScript 规范实现。Internet Explorer
- 前言在最一开始，我的B站收藏一直是存放在默认收藏夹中，但是随着视频收藏的越来越多，没有分类的视频放在一起，想在众多视频中找到想要的视频非常困
- 锁的定义在计算机程序中锁用于独占资源，获取到锁才可以操作对应的资源。锁的实现锁在计算机底层的实现，依赖于CPU提供的CAS指令（compar
- 本文实例讲述了JS学习笔记之数组去重实现方法。分享给大家供大家参考，具体如下：操作的数组 let arr=[0,1,23,'1
- 所有标准的序列操作对字符串都适用，但字符串是不可变的字符串常量：单引号：‘spa"m'双引号："spa'
- Vuex使用单一状态树（一个对象就包含了全部的应用层级状态），它作为唯一数据源存在，每个应用仅仅有一个store实例。单一状态树使得我们能够
- declare @t varchar(255),@c varchar(255) declare table_cursor cursor fo
- 速查表是帮你记住东西的有效工具。Web设计师和开发者经常使用的快捷键简表会使他们在网上的工作效率大大提高。事实上，速查表就是来帮助我们把日常
- 在JAVASCRIPT中LEFT函数的等价函数：function left(mainStr,lngLen) {if&nb
- 这是一篇关于怎样精简代码和Asp 特征以获得最快执行速度的详细文章。对于一个急燥的用户来说，任何在按下用户按钮到结果出现在它们的屏幕之间的延
- 本文实例讲述了python实现的用于搜索文件并进行内容替换的类。分享给大家供大家参考。具体实现方法如下：#!/usr/bin/python
- 本文实例讲述了Python使用matplotlib实现在坐标系中画一个矩形的方法。分享给大家供大家参考。具体实现方法如下：import ma
