CSS 定位与层叠上下文速查
position 取值、包含块与 z-index 生效条件
REFERENCE · 5 ROWS
z-index 只对定位元素(或 flex/grid 子项)生效;父元素创建层叠上下文后,子元素的 z-index 不会跨出父级。
| 取值 | 参照物 | 是否脱离文档流 | 典型用途 |
|---|---|---|---|
| static | 正常流 | 否 | 默认值 |
| relative | 自身原位置 | 否 | 微调、作为子元素定位参照 |
| absolute | 最近的已定位祖先 | 是 | 角标、下拉层 |
| fixed | 视口 | 是 | 悬浮按钮、固定导航 |
| sticky | 滚动容器 + 阈值 | 否 | 吸顶表头 |
HOW TO USE
怎么用CSS 定位与层叠上下文速查
- 打开CSS 定位与层叠上下文速查,表格已按主题整理好。
- 在右上角输入关键词可即时筛选,不用上下翻找。
- 需要写文档时点「复制为 Markdown」,直接粘到笔记里。
CSS 定位与层叠上下文速查是什么
position 取值、包含块与 z-index 生效条件。CSS 定位与层叠上下文速查按表格整理 5 条常用对照,打开即可查,无需翻文档。
它属于「参考速查」下的「速查表」分类。命令、语法、快捷键的常用速查。 同类工具还包含 HTTP 请求方法对照表、Git 常用命令速查、正则表达式语法速查 等,可以在分类页一次看全。
适用场景
- 处理与「CSS定位」相关的任务时可以直接用。
- 处理与「position」相关的任务时可以直接用。
- 处理与「absolute」相关的任务时可以直接用。
- 处理与「fixed」相关的任务时可以直接用。
- 处理与「sticky」相关的任务时可以直接用。
表格说明
本表共 5 行 4 列,内容按常用程度排序。 表格支持关键词筛选,复制出的 Markdown 可直接用于文档、Wiki 或技术博客。
隐私说明
本工具在浏览器内运行,输入内容不会发送到服务器,也不会被记录。 关闭或刷新页面后,输入即被清空。