CSS —— 子绝父相

相对定位:占位;不脱标

绝对定位:不占位;脱标

希望子元素相对于父元素定位,又不希望父元素脱标(父元素占位)

子级是 绝对定位,不会占有位置, 可以放到父盒子里面的任何一个地方;父盒子布局时,需要占有位置(占据原来的位置),父亲只能是 相对定位


子绝父相例子

注意:

1.首先两标签得是嵌套关系(父子关系),不可以是兄弟关系

2.top、right、bottom、left这四个属性要生效的话,必须得设置相对定位/绝对定位

子绝例子

相关推荐
老萬頭几秒前
【技术深水区】抖音 WEB 端逆向:从零到一拿下 a_bogus 参数
前端·爬虫·python
程序员小李白2 分钟前
Vue 组件通信 极简速记版
前端·javascript·vue.js
光影少年2 分钟前
跨域问题如何解决?
前端·nginx·前端框架
C澒4 分钟前
微前端容器标准化 —— 公共能力篇:通用监控能力
前端·架构
念念不忘 必有回响5 分钟前
Next.js 14-16 全栈开发实战:从 App Router 核心原理到 Server Actions 深度剖析
前端·nextjs
英俊潇洒美少年6 分钟前
React 16 → 17 → 18 → 19 完整区别
前端·javascript·react.js
你会发光哎u6 分钟前
了解React并解析JSX语法
前端·react.js·前端框架
533_8 分钟前
[vxe-table el-tree] 树表格:选中子节点,父节点无影响;选中父节点,子节点被选中,el-tree也同理
前端·javascript·vue.js
英俊潇洒美少年11 分钟前
Vue2 和 Vue3 所有区别
前端·javascript·vue.js
一个写bug的人13 分钟前
elementui中表格的表头固定 侧边列表固定 滚动条在头部 且使用鼠标滚轮横向时 可同步给顶部滚动条
前端·javascript·elementui