Position

定位 = 定位模式 + 边偏移

所谓边偏移，就是相对于上下左右四个属性的偏移距离。

1. position: static;

默认的定位，无定位的意思。没有偏移，按照标准流的特性摆放位置。

2. position: relative;

相对于不加定位情况下的偏移。

相对于自己原来的位置为准。不脱离标准流。

.nav {
	position: relative;
    top： 80px;
    left: 80px;
}

3. position: absolute;

相对于祖先元素的偏移。如果没有父元素或者父元素没有position属性(除了static)，则以浏览器(Document)为准。

脱离标准流。

.nav {
    position: absolute;
    top： 80px;
    left: 80px;
}

通常使用绝对定位的元素，其父元素使用相对定位，即子绝父相。

4. position: fixed;

相对于浏览器的可视窗口固定。脱离标准流。

跟父元素没有任何关系。

不随滚动条滚动。

.nav {
    position: fixed;
    top： 80px;
    left: 80px;
}

5. position: sticky

粘性定位可以认为是相对定位和固定定位的混合。

以浏览器的可视窗口为参照点移动窗口。

不脱标。必须要使用上下左右四个属性之一，才会生效。IE不支持。

.nav {
    position: sticky;
    top： 0；
}

6. z-index

z-index可以取任何整数。数字大的盒子，压在上方。

只有定位的盒子才有z-index属性。

如果z-index的值一样，则后来者居上。

.nav {
    position: relative;
    top: 10%;
    z-inedx: 1;
}