一：绝对定位 （position: absolute）
绝对定位：绝对定位是相对于元素最近的已定位的祖先元素（即是设置了绝对定位或者相对定位的祖先元素）。如果元素没有已定位的祖先元素，那么它的位置则是相对于最初的包含块（body）。
绝对定位本身与文档流无关，因此不占空间，普通文档流中的元素的布局就当绝对定位的元素不存时一样，所以 它们可以覆盖页面上其他的元素，且可以通过z-index属性来控制这些层的对方顺序。
特点：
相对于 自己原来在标准流中位置来移动的 原来在标准流的区域继续占有，后面的盒子仍然以标准流的方式对待它。
二：相对定位 （position: relative）
相对定位：相对定位是相对于元素在文档中的初始位置——首先它出现在它所在的位置上（即不设置position时的位置，然后通过设置垂直或水平位置，让这个元素“相对于”它的原始起点进行移动；
注意，在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。
特点：
绝对是以带有定位的父级元素来移动位置 （拼爹型）
如果父级都没有定位，则以浏览器文档为准 移动位置 不保留原来的位置，完全是脱标的。
它必须搭配top、bottom、left、right这四个属性一起使用，用来指定偏移的方向和距离。
三：固定定位（position: fixed）
1.完全脱标 —— 完全不占位置；
2.只认浏览器的可视窗口 —— 浏览器可视窗口 + 边偏移属性 来设置元素的位置；
特点：
跟父元素没有任何关系；
单独使用的 不随滚动条滚动。
四：静态定位(fixed)
静态定位是元素的默认定位方式，无定位的意思。
它相当于 border 里面的none， 不要定位的时 候用。
静态定位 按照标准流特性摆放位置，它没有边偏移。
静态定位在布局时我们几乎不用的
它如果搭配top、bottom、left、right这四个属性一起使用，表示元素的初始位置是基于视口计算的，否则初始位置就是元素的默认位置。
relative定位与absolute定位的区别
初始代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name
最低0.47元/天 解锁文章
2170
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
