最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
CSS 中 position:absolute 与 z-index 对层次结构影响
时间：2022-07-02 12:56:34 编辑：袖梨 来源：一聚教程网
不使用 position
这种情况下每一层都遵循 HTML 定位规则,其中的 left,right,top,bottom 定位信息对其无效,z-index 也不会发挥作用因为没有层叠的情况出现.
2. 使用 absolute
如两个绝对定位对象的 z-index 属性具有同样的值,那么将依据它们在HTML文档中声明的顺序层叠.
2.1 未使用 z-index
这种情况下,依据它们在HTML文档中声明的顺序层叠,因为 z-index 在未设置的情况下,默认为 0 .
| 代码如下 | 复制代码 |
001 002 003 |
|
001:位于最底层 002:位于中间层 003:位于最高层
2.2 使用 z-index
z-index 为无单位的整数值,可为负数.按照数值的大小排列,数值越大,越在外层.
| 代码如下 | 复制代码 |
001 002 003 |
|
001:位于中间层 002:位于最高层 003:位于最底层
2.3 父子元素
对于父子元素,子元素的从属于父元素的层次,子元素在父层的上面
| 代码如下 | 复制代码 |
001 002 003 |
|
相关文章
- 消逝的光芒困兽D4藏宝图宝藏怎么获得 D4藏宝图宝藏获取攻略 10-10
- 我的世界粗铜块怎么获得 粗铜块获取方法介绍 10-10
- 消逝的光芒困兽支线疯狂杀戮第三章流程攻略 支线疯狂杀戮第三章怎么过 10-10
- 消逝的光芒困兽A1藏宝图宝藏在哪 A1藏宝图宝藏获取攻略 10-10
- 我的世界粗铁块怎么获得 粗铁块获取方法介绍 10-10
- 我的世界下界合金块怎么获得 下界合金块获取方法介绍 10-10