定位 position
1.相对定位 relative
- 开启元素相对定位，是相对于元素在文档流中原本的位置定位的，不脱离文档流，如果不设置偏移量，元素不会发生任何变化
- 不改变元素性质（块级/内联元素）
2.绝对定位 absolute
- 绝对定位的元素，是相对于最近开启定位的父元素定位，如果没有，则相对于窗口定位
- 脱离文档流
- 会改变元素性质，内联元素会转换为块元素
3.固定定位 fixed
- 脱离文档流
- 固定定位永远相对于窗口定位，不随滚动条滚动
4.默认值 static
没有定位
偏移量
当开启了元素的定位时（非static），可以通过left、right、top、bottom四个属性来设置元素的偏移量。通常偏移量只需要两个就可以对一个元素进行定位 一般选择水平方向的一个偏移量和垂直方向的偏移量来为一个元素定位。
层级 z-index
- 只有开启定位的元素才可以设置z-index
- 属性值：整数，数值越大，层级越高，越靠前展示
- 如果定位元素的层级一样，则结构上下面的html元素会覆盖上面的元素，可以通过设置z-index改变元素的层级
child1 和child2 元素都没有设置定位：
只有child1 设置定位：
child1 和child2 元素都设置定位：
child1 和child2 元素都设置定位后，child1的z-index为1，child2的层级为0：