1.z-index用来控制元素重叠时堆叠顺序。

适用于:已经定位的元素(即position:relative/absolute/fixed)。

2.不使用z-index的时候,堆叠顺序如下(从下到上):

  • 根元素(即HTML元素)的background和borders
  • 正常流中非定位后代元素(这些元素顺序按照HTML文档出现顺序)
  • 已定位后代元素(这些元素顺序按照HTML文档出现顺序)

3.使用z-index的时候,堆叠顺序如下(从下到上):

  • 根元素(即HTML元素)的背景和border
  • 正常流中非定位后代元素(这些元素顺序按照HTML文档出现顺序)
  • 浮动元素(浮动元素之间是不会出现z-index重叠的)
  • 正常流中inline后代元素
  • 已定位后代元素(这些元素顺序按照HTML文档出现顺序)

4.与文档渲染的先后顺序还是有关系的。

z-index--记录七的更多相关文章

  1. leveldb 学习记录(七) SSTable构造

    使用TableBuilder构造一个Table struct TableBuilder::Rep { // TableBuilder内部使用的结构,记录当前的一些状态等 Options options ...

  2. Spring学习记录(七)---表达式语言-SpEL

    SpEL---Spring Expression Language:是一个支持运行时查询和操作对象图表达式语言.使用#{...}作为定界符,为bean属性动态赋值提供了便利. ①对于普通的赋值,用Sp ...

  3. git使用记录七:对工作区和暂存区的一些操作场景

    比较暂存区和HEAD所含文件的差异? 操作场景如下: 修改readme.md 文档 vi readme.md 加入到暂存区域 git add readme.md 使用git diff -cached ...

  4. 开发错误记录七: Failed to create JVM:error code -4

    今天启动Android studio 直接报如下错误: 用 java -verion 发现并不是环境变量没配置好,而是系统分配的内存,没有达到,as 的要求一种是:重启电脑,再启动 就ok 二种是 重 ...

  5. python 零散记录(七)(下) 新式类 旧式类 多继承 mro 类属性 对象属性

    python新式类 旧式类: python2.2之前的类称为旧式类,之后的为新式类.在各自版本中默认声明的类就是各自的新式类或旧式类,但在2.2中声明新式类要手动标明: 这是旧式类为了声明为新式类的方 ...

  6. python 零散记录(七)(上) 面向对象 类 类的私有化

    python面向对象的三大特性: 多态,封装,继承 多态: 在不知道对象到底是什么类型.又想对其做一些操作时,就会用到多态 如 'abc'.count('a') #对字符串使用count函数返回a的数 ...

  7. zeromq学习记录(七)订阅发布消息封装

    之前也有提到 使用订阅发布 pub sub模式必须要显示定义ZMQ_SUBSCRIBE 只有以此模式定义的过滤字节开头的消息才会被订阅者收到 如果想收到所有信息 可定义subscriber.setso ...

  8. 【异常记录(七)】MVC:从客户端中检测到有潜在危险的 Request.Form 值 的解决方法 [转]

    从客户端(Content="<EM ><STRONG ><U >这是测试这...")中检测到有潜在危险的Request.Form 值. 说明:  ...

  9. LoadRunner11学习记录七 -- 负载生成器、事务&集合点顺序、HTML&URL录制

    1.什么情况下用到负载生成器? 当需要使用多台测试机对同一服务器同时压力测试时,需要配置负载生成器. 2.LoadRunner中事务和集合点的放置顺序问题 1)事务放在集合点前面 这时事务的时间包含了 ...

  10. python UI自动化实战记录七:页面2用例编写

    使用python自带的unittest测试框架,用例继承自unittest.TestCase类. 1 引入接口类和页面类 2 setUp函数中打开页面,定义接口对象 3 tearDown函数中关闭页面 ...

随机推荐

  1. HTML5 sessionStorage会话存储

    sessionStorage 是HTML5新增的一个会话存储对象,用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据.本篇主要介绍 sessionStorage(会话存储) ...

  2. python程序生成平均脸

    简介 项目代码https://github.com/LiuRoy/pokerface 原文链接http://www.cnblogs.com/lrysjtu/p/5492547.html 写这个项目的本 ...

  3. 9、 Struts2验证(声明式验证、自定义验证器)

    1. 什么是Struts2 验证器 一个健壮的 web 应用程序必须确保用户输入是合法.有效的. Struts2 的输入验证 基于 XWork Validation Framework 的声明式验证: ...

  4. 如何在网页中提取Email地址

    开博好久了,今天第一次发表技术文档,之前总是将一些好的事例保存在电脑,时间久了找起来也很麻烦,所以还是放在博客里进行归类比较方便,这样也能将自己在学习过程中的一些心得体会分享给大家,也能给需要的人一点 ...

  5. 趣说游戏AI开发:曼哈顿街角的A*算法

    0x00 前言 请叫我标题党!请叫我标题党!请叫我标题党!因为下面的文字既不发生在美国曼哈顿,也不是一个讲述美国梦的故事.相反,这可能只是一篇没有那么枯燥的关于算法的文章.A星算法,这个在游戏寻路开发 ...

  6. slf4j中的MDC

    slf4j中MDC是什么鬼 slf4j除了trace.debug.info.warn.error这几个日志接口外,还可以配合MDC将数据写入日志.换句话说MDC也是用来记录日志的,但它的使用方式与使用 ...

  7. 简述我的SOA服务治理

    SOA服务治理 1.解决业务部门服务冲突和纠纷2.版本定义与版本管理3.服务备案与服务管理4.业务监督与服务监控 SOA的战略目的 一.业务价值胜过技术策略 二.战略目标胜过具体项目的效益 三.内置的 ...

  8. date命令

    GNU的date提供+%s(小写s), 能打印出自1970-01-01 00:00:00到当前时间的秒数. 这可能大家都不陌生,但有两点需要注意: 1. %s存在于GNU扩展版本.像在solaris等 ...

  9. BZOJ 3504: [Cqoi2014]危桥 [最大流]

    3504: [Cqoi2014]危桥 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1407  Solved: 703[Submit][Status] ...

  10. Fresnel Reflection - 菲涅尔反射

    [Fresnel Reflection - 菲涅尔反射] “菲涅尔”是一个人的名字,因为他发现了一个有关反射的光学现象,这个现象就用这个人的名字命名了.那么,是什么现象呢? 这就是反射/折射与视点角度 ...