首页
课程
证书
师资
就业
关于
当前位置:
知了堂
>
技术干货新
> css绝对定位和相对定位的区别是什么?前端必学
css绝对定位和相对定位的区别是什么?前端必学
作者:
知了姐
发布时间:
2022-07-13
前端是很多人都想学的方向,因为IT方向前端入门最容易,入门前端就不许得学会CSS层叠样式表,今天来看看CSS中的定位。CSS绝对定位和相对定位的区别是什么?前端必学。
CSS进行定位使用的是position属性,该属性一共有五个属性值,分别是static(静态定位)、relative(相对定位)、fixed(固定定位)、absolute(绝对定位)、sticky(元素根据用户的滚动位置进行定位)。今天我们重点来看看relative(相对定位)和absolute(绝对定位)。
CSS相对定位:position:relative;
指在其正常的位置上偏移;relative,使用相对定位时,移动后,它原来占的位置不会被其它元素占用。
CSS绝对定位:position:absolute;
指相对于父元素来进行top,left,bottom,right进行偏移。absolute使用绝对定位时,父元素必须有position属性,如果没有,就相对于父的父元素。谁有position属性就相对于谁,都没有就相对于body.
css绝对定位和相对定位的区别:
相对定位:相对自己原来的位置发生偏移,不会脱离文档流,不会删除它原来在文档流中占据的位置,且后面是元素不会填补空位
绝对定位:相对它的父元素发生偏移(而且这个父元素必须设置了position属性,如果父元素没有position属性,则从最近的父元素开始找,直到找到body为止),会脱离文档流,后面的元素会填补它原来的位置。
css绝对定位和相对定位的区别是什么?前端必学。想学前端,关注程度知了堂
前端培训
教学,深厚的教学经验,丰富的实践项目,优厚的高新岗位,无一不在保证你的学习效率。
上一篇:div+css布局是什么意思?为什么使用div+css布局
下一篇:什么叫同步加载?同步加载和异步加载的区别
推 荐 阅 读
走进人工智能AIGC的新世界,汇智知了堂19.9元开启你的AI技能之旅
以赛促学|知了汇智“知了杯”网络安全趣味赛在西科大圆满落幕
知了汇智斩获奇安信金牌代理权,共筑网络安全新篇章
有哪些免费的ai工具?按头推荐这6款
网络安全类证书有哪些?让你在职场脱颖而出
汇智知了堂网络安全75班晨会:深入探索NAS应用,打造网络安全新高度
汇智知了堂——信创国产化,技术变革与你同行
售前工程师适合女生吗?女生也能闪耀的舞台
代码审计是做什么的:守护数字世界的隐形守护者
网络安全培训哪个靠谱?选择汇智知了堂,为您的网络安全保驾护航