CSS —— 子绝父相

相对定位:占位;不脱标

绝对定位:不占位;脱标

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

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


子绝父相例子

注意:

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

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

子绝例子

相关推荐
Wh1teR0se2 小时前
[极客大挑战 2019]Secret File--详细解析
前端·web安全·网络安全
ZhaiMou3 小时前
HTML5拖拽API学习 托拽排序和可托拽课程表
前端·javascript·学习·html5
code_shenbing6 小时前
跨平台WPF框架Avalonia教程 三
前端·microsoft·ui·c#·wpf·跨平台·界面设计
白臻6 小时前
使用element-plus el-table中使用el-image层级冲突table表格会覆盖预览的图片等问题
前端·vue.js·elementui
北极糊的狐6 小时前
vue使用List.forEach遍历集合元素
前端·javascript·vue.js
晓看天色*6 小时前
[JAVA]MyBatis框架—获取SqlSession对象
java·开发语言·前端
ZVAyIVqt0UFji7 小时前
Reactflow图形库结合Dagre算法实现函数资源关系图
开发语言·前端·javascript·ecmascript
luckilyil7 小时前
前端—Cursor编辑器
前端·编辑器
cooldream20097 小时前
快速上手 Vue 3 的高效组件库Element Plus
前端·javascript·vue.js·element plus
我是苏苏7 小时前
Web开发:ORM框架之使用Freesql的DbFrist封装常见功能
java·前端·jvm