在CSS中position: relative是啥意思

Posted 2023-05-05

css中position: relative的意思是：
相对定位，对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。
位置属性被设置为relative之后，是相对于前面的容器定位的。这个时候不能用top left在定位。应该用margin。它可以随窗口大小变化。但大小仍然不会变。要是你设置成width:100%;height:100%;这样就会随着窗口变大变小。
比如：<div class="1"</div<div class="2"</div
当1固定了位置。1的样式 float:left;width:100px; height:800px;
2的样式为 float:left; position：relative；margin-left:20px;width:50px;
2的位置在1的右边，距离120px.
当Position属性值为Relative时对象原来占有的位置保留，其后面的对象按原来文档流仍然保持原来的位置Top的值表示对象相对原位置向下偏移的距离bottom的值表示对象相对原位置向上偏移的距离两者同时存在时，只有Top起作用。left的值表示对象相对原位置向右偏移的距离right的值表示对象相对原位置向左偏移的距离两者同时存在时，只有left起作用。
希望以上的回答能够帮到你！ 参考技术A 相对定位，对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。 位置属性被设置为relative之后，是相对于前面的容器定位的。这个时候不能用top left在定位。应该用margin。它可以随窗口大小变化。但大小仍然不会变。要是你设置成width:100%;height:100%;这样就会随着窗口变大变小

css中position属性：absolute和relative

absolute :将对象从文档流中拖出，使用 left ， right ， top ， bottom等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据 body 对象。而其层叠通过 z-index 属性定义。

relative :对象不可层叠，但将依据 left ， right ， top ， bottom 等属性在正常文档流中偏移位置。