zIndex属性在IE中无效
在ie中他的子类的zindex就以父类为准;
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#div1{ width:200px; height:200px; float:left; border:1px solid red;}
#div2{ width:200px; height:200px; float:left; border:1px solid black;}
.blue{ width:300px; height:300px; background-color:blue;}
.green{ width:300px; height:300px; background-color:green;}
</style>
</head>
<body>
<div id="div1" style="position:relative;z-index:1;">
<div class="blue" style="position:absolute;z-index:9999"><span style="color:red;">zIndex:9999</span></div>
</div>
<div id="div2" style="position:relative;z-index:2;">
<div class="green" style="position:absolute;z-index:10"><span style="color:#fff">zIndex:10</span></div>
</div>
</body>
</html>
div1子类的zindex为9999,父类的zindex为1, div2的子类的zindex为10,父类的zindex为2,比较父类的zindex大小,所以div1,无法覆盖div2
zIndex属性在IE中无效的更多相关文章
- css z-index属性使用过程中遇到的问题
z-index属性在web开发中会经常使用,其主要的作用简单的说就是把元素的position设置为absolute.fixed之后,可以调节元素在文档上的层级关系.比如经常见到的dialog,mask ...
- CSS:z-index层级在IE中无效
引用地址:http://apps.hi.baidu.com/share/detail/19853262 在CSS中,只能通过代码改变层级,这个属性就是z-index,要让z-index起作用有个小小前 ...
- CSS z-index 属性的使用方法和层级树的概念
之前有一篇文章提到过z-index,我们知道只有在元素设置了position部位static时才生效,而且z-index也跟父元素有关系,今天就在ie7遇到类似问题,在网上查了一些资料,发现一篇好文章 ...
- 【转】CSS z-index 属性的使用方法和层级树的概念
文章转自:CSS z-index 属性的使用方法和层级树的概念,另外加了一点自己的注释 CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面 ...
- css z-index属性
原文地址:http://www.neoease.com/css-z-index-property-and-layering-tree/ CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有 ...
- div层调整zindex属性无效原因分析及解决方法
在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效.在CSS中,只能通过代码改变层级,这个属性就是z- index,要让z-index起作用有个小小前提,就是元素的po ...
- 【转载】div层调整zindex属性无效原因分析及解决方法
在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效.在CSS中,只能通过代码改变层级,这个属性就是z-index,要让z-index起作用有个小小前提,就是元素的pos ...
- 【Web前端】div层调整zindex属性无效原因分析及解决方法
在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效.在CSS中,只能通过代码改变层级,这个属性就是z- index,要让z-index起作用有个小小前提,就是元素的po ...
- 深入理解css中position属性及z-index属性
深入理解css中position属性及z-index属性 在网页设计中,position属性的使用是非常重要的.有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难. position属性共 ...
随机推荐
- Bootstrap第一天
1.代码引入: 第一步:在html5文档 <meta name="viewport" content="width=device-width, initial-sc ...
- datatable,查询,排序,复制等操作
DataTable排序,检索,合并详解 一.排序 获取DataTable的默认视图 对视图设置排序表达式 用排序后的视图导出的新DataTable替换就DataTable (Asc升序可省略,多列排序 ...
- Eclipse+ADT的环境搭建
Index: . Java环境变量的设置 . Android环境变量的设置 1.Java环境变量的设置 A.属性名称:JAVA_HOME 属性值:C:\Program Files\Java\jdk1. ...
- Java Socket 入门1
由程序逻辑可以看到 这是一个 客户端和服务端一对一聊天的程序 首先由服务端说第一句话然后对话才开始 且只能客户端一行话 服务端再一行话 这样往复进行 客户端若想不等服务端回应继续说话是不行的 服 ...
- 定位CPU高的方法
CPU占用高,最常见的原因是死循环或者类死循环的操作,如果要逐一排查代码,费时费力,可以先用工具 工具1.windbg,windows出品的牛刀一枚以管理员运行windbg,File->Atta ...
- AOP 面向切面编程、拦截器
AOP(Aspect-Oriented Programming,面向切面的编程),它是可以通过预编译方式和运行期动态代理实现在不修改源代码的情况下给程序动态统一添加功能的一种技术.它是一种新的方法论, ...
- Android 关于调用系统内已安装的相机问题
Intent intent=new Intent(MediaStore.ACTION_IMAGE_CAPTURE); startActivityForResult(intent,1); 调用系统内已安 ...
- LINQ 图解
LINQ 图解 原创地址:http://www.cnblogs.com/jfzhu/archive/2013/01/01/2841332.html 转载请注明出处 LINQ,语言集成查询(Langua ...
- Piggy-Bank (完全背包)
Description Before ACM can do anything, a budget must be prepared and the necessary financial supp ...
- vim 多文件编辑【超实用】
vim 多文件编辑(偶的linux笔记) http://blog.csdn.net/lcj_cjfykx/article/details/18805721 通过vim打开的每个文件都对应着一个buff ...