css中绝对定位只有一个元素起作用

在CSS中，绝对定位是相对于最接近的已定位祖先元素进行定位的。如果没有已定位的祖先元素，则相对于最初的包含块进行定位。因此，如果多个元素都是绝对定位，并且它们的最近已定位祖先元素是相同的，则它们会相互影响并叠加在一起。

但是，如果多个元素都是绝对定位，但它们的最近已定位祖先元素不同，则它们会相对于各自的祖先元素进行定位，而不会相互影响。

因此，绝对定位并不是只有一个元素起作用，而是取决于元素的祖先元素的定位情况。

相关问题

css中绝对定位和相对定位

在CSS中，绝对定位和相对定位是两种常用的定位方式。

绝对定位（absolute）是指元素从文档流中脱离出来，并相对于其最近的已定位的祖先元素进行定位。通过设置left、right、top和bottom属性，我们可以决定元素相对于其祖先元素的位置。绝对定位的元素不会对其他元素产生影响，也不会被其他元素所覆盖。

相对定位（relative）是指元素保持在文档流中的位置，但可以通过设置left、right、top和bottom属性来相对于其正常位置进行微调。相对定位的元素仍然会占据原来的空间，并对其他元素产生影响。

举个例子，如果我们有一个元素的id为"box_relative"，我们可以通过以下CSS代码将其设置为绝对定位：

#box_relative {
  position: absolute;
  left: 30px;
  top: 20px;
}

这样，元素"box_relative"会相对于其最近的已定位的祖先元素进行定位，并且相对于祖先元素的左边缘偏移30像素，上边缘偏移20像素。

css绝对定位盒子如何继承父级元素大小

绝对定位的盒子不会继承父级元素的大小。它的大小由自身的宽度和高度属性决定。当父级元素没有设置定位时，绝对定位的盒子会相对于浏览器窗口进行定位，而不是相对于父级元素。\[3\]当父级元素有定位时，绝对定位的盒子会相对于最近的定位祖先元素进行定位。如果没有定位祖先元素，它会相对于文档主体进行定位，并随页面滚动一起移动。\[2\]因此，绝对定位的盒子的大小和位置是相对于其自身和定位祖先元素来确定的，而不是继承父级元素的大小。
#### 引用[.reference_title]
- *1* *2* *3* [CSS相对定位和绝对定位](https://blog.csdn.net/m0_46527751/article/details/123993295)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]