如果三个 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. C++回顾day03---<多态>

    一:错误理解下的多态 #include <iostream> using namespace std; class Parent { public: Parent() { cout < ...

  2. VMWare的host-only/bridged/NAT连接图文介绍

    1 VMware简介 VMWare虚拟机软件是一个“虚拟PC”软件,它使我们可以在一台机器上同时运行二个或更多Windows.Linux等系统. 如果我们需要使用多个系统的话,传统的方式有两种: .使 ...

  3. 第二节：重写（new）、覆写（overwrite）、和重载（overload）

    一. 重写 1. 关键字:new 2. 含义:子类继承父类中的普通方法,如果在子类中重写了一个和父类中完全相同的方法,子类中会报警告(问是否显式的隐藏父类的中的方法),如果在子类中的方法前加上new关 ...

  4. django - 总结 - admin

    admin组件,一旦我们注册了表以后,会自动生成很多url,那他是如何添加的呢, 因为admin在启动后会自动执行每个app下的ready方法: 具体是由 from django.utils.modu ...

  5. HttpUtility.UrlEncode编码重写

    1. 某些系统方法,例如.NET系统方法HttpUtility.UrlEncode会将‘=’编码成‘%3d’,而不是%3D,导致加密签名通不过验证,请开发者注意检查. 2.Java 1.3和早期版本中 ...

  6. v-model

    仅用于以下控件: <input> <select> <textarea> 组件 v-model以Vue 实例的数据作为数据来源,应当在组件的 data 选项中声明初 ...

  7. js倒计时一分钟

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. BootStrap顺序验证和指定字符个数发送请求

    fields: { curPwd: { verbose: false, //代表验证按顺序验证.验证成功才会下一个(验证成功才会发最后一个remote远程验证) threshold: 6,//有6字符 ...

  9. java实现http请求

    String apiUrl = "https://api.seniverse.com/v3/weather/now.json?key=" + key + "&lo ...

  10. Selenium+Python ---- 免登录

    1.免登录在进行测试的过程中难免会遇到登录的情况,给测试工作添加了工作量,本文仅提供一些思路供参考解决方式:手动请求中添加cookies.火狐的profile文件记录信息实现.人工介入.万能验证码.去 ...