ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

什么时候用相对定位或绝对定位

2022-08-12 23:01:21  阅读:148  来源: 互联网

标签:定位 元素 位置 绝对 111222 相对 文档


要理解定位你要先理解文档流,在文档流中相对定位的元素占有位置,而且会影响后面的元素(块元素、行内块元素),比如两个div并排,另外一个会换行。
<div>111</div>
<div>222</div>
而绝对定位就是把该元素从文档流中踢出,不会占用文档流的位置,也不会影响后面的元素。
<div style="position: absolute;">111</div>
<div>222</div>
如上面的实例,111和222会重叠,审查元素你会发现222有实际位置,111没有位置。他是使用left,right,top,bottom等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位,如果不存在这样的父对象,则依据body对象。而其层叠通过z-index属性定义 。

网页布局涉及到各种设备各种分辨率下的兼容,所以就注定绝对定位不能适用于大部分场景。。所以布局只能依赖于上级元素的位置,而不能依赖于设备的高度和宽度。

适合绝对定位的场景主要是一些页面辅助功能

原文链接:https://blog.csdn.net/whoops_butterfly/article/details/77937750

标签:定位,元素,位置,绝对,111222,相对,文档
来源: https://www.cnblogs.com/stepforeward/p/16581658.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有