如果三个 div 全部设置 position: absolute; 绝对定位，且未设置 z-index，  则从代码结构上    下面的元素 会盖住 上面的元素。

z-index 层级：

  • 通过 z-index 属性 设置元素的 层级。
  • z-index : 正整数;
  • 层级越高 ，越优先显示在最上面。
  • z-index: 1;    大于    没设置 z-index 的元素
  • 对于没有开启定位的元素，z-index 无效。
  • 父元素层级再高，也不会盖住子元素。

__x__(35)0908第五天__ 层级 z-index的更多相关文章

  1. __x__(34)0908第五天__ 定位 position

    position 定位 指将原始摆放到页面的任意位置. 继承性:no 默认值:static        没有定位,原始出现在正常的文档流中 可选值: static :    默认值,元素没有开启定位 ...

  2. __x__(29)0908第五天__高度塌陷 问题

    高度塌陷 在文档流中,父元素的高度默认是被子元素撑开的. 但是当为 子元素 设置 float 时,子元素会完全脱离文档流,无法再撑开父元素,导致父元素高度塌陷...以致于布局混乱 变成 BFC块级格式 ...

  3. __x__(30)0908第五天__导航条的练习 <div>版本

    效果图:  html源代码: <!doctype html> <html> <head> <meta charset="utf-8" /& ...

  4. __x__(31)0908第五天__导航条的练习 <ul> 版本

    效果图:  html代码: <!doctype html> <html> <head> <meta charset="utf-8" /&g ...

  5. __x__(35)0908第五天__opacity 透明度

    opacity 透明度 设置一个  0 - 1 之间的值. opacity: 0;    完全透明 opacity: 0.5    半透明 opacity: 1;    完全不透明 缺点: IE8及以 ...

  6. __x__(36)0908第五天__背景 background

    1. 背景 background: red url(img/cat.gif) repeat-x fixed; 2. 背景颜色 background-color: red; 3. 背景图片 backgr ...

  7. __x__(40)0909第五天__表格 table 的 css 样式 美化

    如果就向下面的代码那样,不写 tbody , 则浏览器自添加 tbody , 并将所有的 tr 移入 tbody 意味着 tr 并非 table 的子元素,而是 tbody 的子元素. 所以 以后编写 ...

  8. __x__(41)0909第五天__长表格

    长表格 银行流水,表格很长... 则需要将表格分为 表头 thead ,主体数据 tbody , 表格底部 tfoot 三个标签无顺序要求,易于维护:thead → tfoot → tbody 如果没 ...

  9. __x__(32)0908第五天__Photoshop的基本操作

    1. 设置 Photoshop 的单位为 像素px 2. 标尺   显示与隐藏 Ctrl + r 3. 放大与缩小 Ctrl + 1    放大到100% Ctrl + 0    适应屏幕 Alt + ...

随机推荐

  1. MS SQL Server 数据库连接字符串详解

    MS SQL Server 数据库连接字符串详解 原地址:http://blog.csdn.net/jhhja/article/details/6096565 问题 : 超时时间已到.在从池中获取连接 ...

  2. Maven 学习总结 （二） 之 生命周期与插件

    五.生命周期与插件 1.Maven有三套独立的生命周期:clean.default和site. clean生命周期的目的是清理项目,default生命周期的目的是构建项目,site生命周期的目的是建立 ...

  3. Hadoop记录- Yarn scheduler队列采集

    #!/bin/sh ip=10.116.100.11 port=8088 export HADOOP_HOME=/app/hadoop/bin rmstate1=$($HADOOP_HOME/yarn ...

  4. Entity Framework入门教程（3)---EF中的上下文简介

    1.DbContext(上下文类) 在DbFirst模式中,我们添加一个EDM(Entity Data Model)后会自动生成一个.edmx文件,这个文件中包含一个继承DbContext类的上下文实 ...

  5. 第二节：比较DateTime和DateTimeOffset两种时间类型并介绍Quartz.Net中用到的几类时间形式(定点、四舍五入、倍数、递增)

    一. 时间的类型 1. 背景 这里为什么要介绍时间类型呢,明明是定时调度篇,原因是在定时任务中,任务什么时间开始执行,什么时间结束执行,要用到各种各样的时间模式,虽然这不能算是一个复杂的问题,但在正式 ...

  6. 后台挂载/卸载程序[Linux/Windows]

    后台挂载应用程序 即使关闭掉控制台窗口,该程序的进程也将会一直运行下去 #Windows 1.编写bat命令文件[形如:a.bat] 2.cmd执行:start /b a.bat #Linux noh ...

  7. iTOP-iMX6UL全能板-linux-usb-wifi的使用

    本文档介绍的是在本文档介绍的是在 Linux 系统环境下iTOP-imx6ul全能版 usb wifi 连接路由器上网 实验调试步骤.我们使用的是 imx6ul 全功能底板. 1 硬件 本文档测试使用 ...

  8. 【原创】Linux基础之查看linux发行版以及内核版本

    redhat查看发行版 # cat /etc/redhat-release CentOS Linux release 7.2.1511 (Core) 查看内核版本 # uname -aLinux $h ...

  9. noj 算法 八数码问题

    描述 在九宫格里放在1到8共8个数字还有一个是空格,与空格相邻的数字可以移动到空格的位置,问给定的状态最少需要几步能到达目标状态(用0表示空格):1 2 34 5 67 8 0   输入 输入一个给定 ...

  10. vue-地址插件 v-region

    demo地址:https://terryz.gitee.io/vue/#/region/demo