CSS 系列六 定位 、定位拓展（Z-index等）、 元素的显示与隐藏的三种方式

--------------------------- 六 定位 ---------------------------

1.1 为什么需要定位

1. 某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子.
2. 当我们滚动窗口的时候，盒子是固定屏幕某个位置的

以上效果，标准流或浮动都无法快速实现，此时需要定位来实现。
所以：

1. 浮动可以让多个块级盒子一行没有缝隙排列显示， 经常用于横向排列盒子。
2. 定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子。

1.2 定位组成

定位：将盒子定在某一个位置，所以 定位也是在摆放盒子， 按照定位的方式移动盒子
定位 = 定位模式 + 边偏移 。
定位模式 用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。

1.21 定位模式

定位模式决定元素的定位方式 ，它通过 CSS 的 position 属性来设置，其值可以分为五个：

1. static （静态定位，默认的）
2. relative （相对定位）
3. absolute （绝对定位）
4. fixed （固定定位）
5. sticky （粘性定位）

1.22 边偏移

边偏移就是定位的盒子移动到最终位置。有 top、bottom、left 和 right 4 个属性。

1. top （ 顶部 偏移量，定义元素相当于其父元素 上边线的距离 ）
2. bottom （底部）
3. left （左侧）
4. right （右侧）

1.3 静态定位 static（了解）

静态定位是元素的默认定位方式，无定位的意思。

	选择器 {
    position: static; }

1. 静态定位按照标准流特性摆放位置，它没有边偏移