z-index它可真是一个神奇的东西,它可以随意安排你的层的叠加问题。
如你想让红色矩形压在蓝色矩形上,正常布局先建立一个红色的再建议一个蓝色的,就可以了。
但如果我相反来建立,那么就得借助z-index方法了。
 
用z-index需要先加position:absolute/relative定位,不然是不起作用的。
z-index 是要考虑父级的,如果父级z-index为2,那么子级为200也不会覆盖住父级z-index为4子级为2的图层的。
 
在标准浏览器中,对父级的要求不是特别高,同级的对应上z-index可以了。但要注意的是
父级里放一个子级那么父级是无法放在子级之上的,需要放在同一级别中才可以(经过测试的)
IE6对z-index上对父级的要求是比较高的,如果两个级别在标准浏览器中虽然好了,但IE6需要对父级也加上z-index
不然上一行中所加的z-index会无法覆盖下面的图层。所以在做的时候,需要给下一行的父级加上z-index
(前两天又研究了一下这个问题,所以需要在这个给予更加详细的说明。因为在IE6中需要给父级添加 z-index 
这样子下面的子级就会被上面的覆盖,所有要动态的改变一下,当经过的时候,当前的z-index增加,其它的为0.反之亦是。
【设置为1都不行,因为父级的权限最高】) 还有一点就是,IE6、7如果没有给带有定位指定z-index的话,那么它会auto创建一个层叠上下文
 
当然熟练了也就知道这些问题了,但百密中有一疏,所以做好在遇到这样问题的时候,多测试几下。不然改起来真的很累人的。
 
##转载请附加此文博客地址(小数)[http://www.cnblogs.com/mcat/]

关于z-index这个层级的问题的更多相关文章

  1. 来看看css3中的box-shadow

    不谈IE,只谈谈box-shadow的具体使用方法 语法: E {box-shadow: <length> <length> <length>?<length ...

  2. 科学计算三维可视化---Mayavi可视化实例

    一:Dragon绘制实例(三维扫描的绘制) 三维扫描主要用于对物体空间外形结构以及色彩进行扫描,用以获得物体表面的空间坐标, 他的主要意义在于能够将实物的立体信息转换为计算机能够直接处理的数据信号,为 ...

  3. 用原生JS实现一个轮播(包含全部代码和详细思路)

    在我看来要想实现轮播主要是要知道当前位于的页面和即将位于的页面.这个案例是通过改变图片的透明度来实现轮播的效果. 我把涉及的知识点分为两个方面,分别是HTML+css和JS. 第一部分(html+cs ...

  4. KineticJS教程(11)

    KineticJS教程(11) 作者: ysm 11.对象的上下关系 11.1.层的上下关系 Kinetic的层是按照添加到舞台的次序,由下向上排列,上层遮盖下层的图形.每个层各自有一个ZIndex编 ...

  5. 20-----定位 (Position)

    定位 定位有三种: 1.相对定位 2.绝对定位 3.固定定位 这三种定位,每一种都暗藏玄机,所以我们要一一单讲. 相对定位 相对定位:相对于自己原来的位置定位 现象和使用: 1.如果对当前元素仅仅设置 ...

  6. Python科学计算三维可视化(整理完结)

    中国MOOC<Pyhton计算计算三维可视化>总结 课程url:here ,教师:黄天宇,嵩天 下文的图片和问题,答案都是从eclipse和上完课后总结的,转载请声明. Python数据三 ...

  7. js 基础篇(点击事件轮播图的实现)

    轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...

  8. 运用<div>布局页面练习

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 关于Cewu Lu等的《Combining Sketch and Tone for Pencil Drawing Production》一文铅笔画算法的理解和笔录。

     相关论文的链接:Combining Sketch and Tone for Pencil Drawing Production 第一次看<Combining Sketch and Tone f ...

  10. 四种比较简单的图像显著性区域特征提取方法原理及实现-----> AC/HC/LC/FT。

    laviewpbt  2014.8.4 编辑 Email:laviewpbt@sina.com   QQ:33184777 最近闲来蛋痛,看了一些显著性检测的文章,只是简单的看看,并没有深入的研究,以 ...

随机推荐

  1. [DEBUG]椭圆的中点Bresenham算法边缘绘制出现错误

    在使用椭圆的中点Bresenham算法绘制椭圆时, 当椭圆足够大时, 椭圆的边缘会出现下面这种情况. 出错原因: 将a, b声明为了int类型, 导致中点判别式中发生溢出 关注后面的a*b*a*b当a ...

  2. 分布式理论:深入浅出Paxos算法

    前言 Paxos算法是用来解决分布式系统中,如何就某个值达成一致的算法.它晦涩难懂的程度完全可以跟它的重要程度相匹敌.目前关于paxos算法的介绍已经非常多,但大多数是和稀泥式的人云亦云,却很少有人能 ...

  3. 3月web前端面试小结

    说一下box-sizing的应用场景 box-sizing的属性值分为两个,border-box和content-box,其中, border-box:width=content+padding+bo ...

  4. io整理

    http://www.cnblogs.com/rollenholt/archive/2011/09/11/2173787.html

  5. 20181023-3 每周例行报告(添加PSP)

    此作业要求:[https://edu.cnblogs.com/campus/nenu/2018fall/homework/2100] 一.本周PSP表格 类型 任务 开始时间 结束时间 中断时间 净时 ...

  6. mysql数据出现Unknown column 'user_uid' in 'field list' sql错误

    来源:https://blog.csdn.net/gnail_oug/article/details/53606608 在操作mysql数据库时提示com.mysql.jdbc.exceptions. ...

  7. 20135202闫佳歆--week6 分析Linux内核创建一个新进程的过程——实验及总结

    week 6 实验:分析Linux内核创建一个新进程的过程 1.使用gdb跟踪创建新进程的过程 准备工作: rm menu -rf git clone https://github.com/mengn ...

  8. linux内核分析第四周学习笔记

    linux内核分析第四周学习笔记 标签(空格分隔): 20135328陈都 陈都 原创作品转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.co ...

  9. Python的三种格式化输出

    今天刚学了python的三种格式化输出,以前没接触过这么有趣的输出方式,现在来分享一下. #!/user/bin/env python#coding:utf-8#三种格式化输出 #第一种格式化输出na ...

  10. Windows 设置开机自动登录

    1. 自己一些windows的虚拟机 有时候开机之后 输入用户名密码时间特别长. 需要等待很久, 如果能够设置开机自动登录的话 能够节约很多时间. 2. 最简单的办法  运行输入 control us ...