CSS(五)(定位)

[](()3.相对定位 relative

---

相对定位是元素在移动位置的时候，是相对于它原来的位置来说的（自恋型）

语法：

选择器{positi 《大厂前端面试题解析+Web核心总结学习笔记+企业项目实战源码+最新高清讲解视频》无偿开源 徽信搜索公众号【编程进阶路】 on：relative;}

相对定位的特点：

1. 它是相对于自己原来的位置来移动的（移动位置的时候参照点是自己原来的位置）。

2. 原来在标准流的位置继续占有，后面的盒子仍然以标准流的方式对待它。

因此，相对定位并没有脱标。

[](()4.绝对定位 absolute

---

绝对定位是元素在移动位置的时候，是相对于它祖先元素来说的。

语法：

选择器{position：absolute；}

绝对定位的特点：

1. 如果没有祖先元素或者祖先元素没有定位，则以浏览器为准定位（Document 文档）。

2. 如果祖先元素有定位（相对、绝对、固定定位），则以最近一级的有定位祖先元素为参考点移动位置。

3. 绝对定位不再占有原先的位置。（脱标）

所以绝对定位是脱离标准流的。

[](()5.子绝父相的由来

---

① 子级绝对定位，不会占有位置，可以放到父盒子里面的任何一个地方