【前言】
经常看到一句话，css使absolute相对于父容器进行定位而不是以body（为什么绝对定位（absolute）的父级元素必须是相对定位（relative））
【总结】
如果父级元素是绝对定位（absolute）或者没有设置，里面的绝对定位（absolute）自动以body定位。这句话是错的。
正确的是：只要父级元素设了position并且不是static（默认既是static），那么设定了absolute的子元素即以此为包含块（最近的）。
绝对定位（Absolute positioning）元素定位的参照物是其包含块，既相对于其包含块进行定位，不一定是其父元素。
.
相关推荐
"绝对定位+相对定位的妙用"是CSS布局技术中的核心概念，它可以帮助我们精确控制网页元素的位置，实现复杂而精致的设计效果。下面将详细讲解这两种定位方式及其相互作用。 1. **相对定位（Relative Positioning）**...
本文主要讨论的是CSS中的两种定位方式：相对定位和绝对定位，特别是在`div`元素中的应用。 1. 相对定位（relative） 相对定位允许元素相对于其原本在正常文档流中的位置进行偏移。当对一个元素设置`position: ...
`，而需要绝对定位的元素设为`position: absolute;`，然后通过调整`top`, `right`, `bottom`, `left`的值来实现对齐。 例如，如果要使一个元素始终位于页面中心，可以这样做： ```css .container { position: ...
绝对定位：元素是相对离它最近的一个已定位的父级元素进行定位 相对定位： position:relative; /*启用相对定位*/ left:150rpx; /*相对于自己往右偏离150*/ top:50rpx; /*相对于自己往下偏离150*/ ...
绝对定位是元素以带有定位的父级元素来移动位置。它的特点是：绝对是以带有定位的父级元素来移动位置（拼爹型）如果父级都没有定位，则以浏览器文档为准移动位量不保留原来的位置，完全是脱标的。 2.2.4 定位口诀 ...
第二步：子容器定位设置为 absolute（绝对定位）。 我要浮出去！ #a{ width:400px; height:100px; background:rgb(0, 0, 0); position:relative;/*父元素>相对定位*/ } #b{ width: 150px; height:50px;
- 相对定位常用于微调元素位置，或者为绝对定位提供参考点。 - 绝对定位适合用于需要元素相对于某个特定祖先元素定位的情况，如下拉菜单、浮动提示框等。 - 固定定位适用于创建固定位置的元素，如固定的顶部导航...
，这条语句的作用将元素从文档流中拖出来,将不占用原来元素的空间，然后使用left、right、top、bottom属性相对于其最接近的一个具有定位属性的父级元素进行绝对定位。如果不存在就逐级向上排查，直到相对于body元素...
3. 绝对定位（absolute）：元素以最近的带有定位的父级元素来移动位置，不占位 4. 固定定位（fixed）：只认浏览器的可是窗口，应⽤：电梯导航，不占位 定位的应用包括： 1. 实现元素的绝对定位 2. 实现元素的固定...
此外，还可以通过调整CSS属性，如增加父级元素的`z-index`值，使得绝对定位元素能够正确显示。需要注意的是，`z-index`只对定位元素（position为relative、absolute或fixed）生效，并且数值较高的元素会在视觉上覆盖...
absolue：绝对定位，用top,bottom,left和right根据有定位的父级元素进行定位，如果无则相对body元素即整个页面文档进行定位。 relative：相对定位，相对自己原来的位置进行定位 fixed：绝对定位，相对浏览器窗口...
如果下面的文字实在是无法理解透，那就记住这节课最后总结的一句话“如果用position来布局页面，父级元素的position属性必须为relative，而定位于父级内部某个位置的元素，最好用absolute，因为它不受父级元素的...
* 绝对定位（position:absolute）：是相对于元素最近的已定位的祖先元素。 * 相对定位（position:relative）：相对定位是相对于元素在文档中的初始位置。 八、Flex 布局 * Flex 布局的基本属性有 display：flex、...
在CSS中，有相对定位（relative）、绝对定位（absolute）和固定定位（fixed）等几种方式。在这个场景下，我们将使用绝对定位来实现居中效果。 代码示例： ```html <!DOCTYPE html> ;charset=utf-8"> 登录框...
10. 浮动元素特性：浮动元素会变为块级元素，向父级元素的边缘靠拢，并可能超出其包含元素。 11. 盒子模型：`border`是一个复合属性，可以单独使用，但子属性需按顺序书写。`padding`的值可以是单值、双值、三值或...
* absolute：绝对定位，绝对定位脱离文档流，参考最近的已经定位（绝对、相对或固定定位）的父元素，通过 top、bottom、left、right 定位。当父级 position 为 static 时，absolute 元素将依据 body 根元素（浏览器...
如果用position属性来布局页面，父级元素的position属性必须为relative，而定位于父级内部某个位置的元素，最好用absolute。定位(position)布局页面说容易非常容易，只需要记住这节课最后一句话就可以了，说困难，那...