CSS —— 子绝父相

相对定位:占位;不脱标

绝对定位:不占位;脱标

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

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


子绝父相例子

注意:

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

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

子绝例子

相关推荐
IT_陈寒20 分钟前
Vite这个坑我帮你踩了,动态导入居然这样才生效
前端·人工智能·后端
swipe24 分钟前
Mem0 x Agent 实战系列:分层记忆 + 三路召回,搭建真正可用的长期记忆层
前端·javascript·面试
鹤鸣的日常31 分钟前
前端运行时动态环境变量方案
前端·react.js·docker·前端框架·vue·gitlab
Lee川32 分钟前
Event Loop 面试通关:从原理到口述再到实战
前端·面试
kyriewen1 小时前
手写 call、apply、bind:从原理到实现,附 3 个最容易忽略的边界情况
前端·javascript·面试
用户2181697049301 小时前
swift (三) 枚举 结构体 类
前端
胡萝卜术1 小时前
从内存视角重新认识 JavaScript 数据类型:一份深度学习笔记
前端·javascript·面试
IVEN_1 小时前
记一次诡异的前端白屏故障:Nginx Proxy Cache 内存缓存"幽灵"事件
前端·nginx
如果超人不会飞1 小时前
TinyRobot SuggestionPills紧凑的建议按钮组组件
前端·vue.js
如果超人不会飞1 小时前
TinyRobot Container构建优雅的AI对话容器
前端·vue.js