定位（position）
概念
将盒子定在某一个位置（最上层）
标准流在最底下 — 浮动中间 — 定位最上层
静态定位（static）
-
静态定位是元素默认的定位方式，无定位的意思。它相当于
border中的none -
静态定位是按照标准流特性摆放位置，它没有边偏移
相对定位(relative)
-
相对定位是元素对于它 原来在标准流中的位置来说的
-
原来在 标准流 的区域 继续占有，后面的盒子依然以标准流的方式对待它
绝对定位(absolute)
- 绝对定位是元素以带有 定位的父元素 来移动位置（如果父级没有定位就会往上找直到浏览器为止）
- 绝对定位的元素完全 不占标准流 中的 位置
子绝父相 : 父级要占有位置所以要相对定位，子级要随意摆放用绝对定位
固定定位(fixed)
- 完全脱标，完全不占位置
- 只认浏览器的窗口
- 跟父元素没有关系，单独使用
- 不随着滚动条滚动
堆叠顺序
在使用定位布局时，可能会出现 盒子重叠的情况
加了定位的盒子，默认后来者居上，后面的盒子会压住前面的盒子
应用 z-index 层叠等级属性可以调整盒子的堆叠顺序
z-index的特性：
- 属性值:正整数、负整数、或0，默认是0，数值越大，盒子就越靠上
- 如果属性值相同，则按照书中书写的顺序，后来居上
- 数字的后边不能加单位
注：
z-index只能用于相对定位、绝对定位和固定定位的元素，其他标准流、浮动和静态定位无效
定位改变display属性
绝对定位和固定的定位也和浮动类似，默认转换的特性转换为行内块。
所以说，一个行内的盒子如果加了浮动、固定定位和绝对定位，不用转换，就可以给这个盒子设置宽度和高度等。
浮动元素、绝对定位元素和固定定位元素的都不会触发外边距合并的问题
小结
| 定位模式 | 是否脱标占有位置 | 移动位置基准 | 模式转换（行内块） | 使用情况 |
|---|---|---|---|---|
| 静态（static） | 不脱标，正常模式 | 正常位置 | 不能 | 几乎不用 |
| 相对定位（relative） | 不脱标，占有位置 | 相对自身位置移动 | 不能 | 基本上单独使用 |
| 绝对定位（absolute） | 完全脱标，不占有位置 | 相对于定位父级移动位置 | 能 | 要和定位父级元素搭配使用 |
| 固定定位（fixed） | 完全脱标，不占有位置 | 相对于浏览器移动位置 | 能 | 单独使用，不需要父级 |