相对定位、绝对定位、固定定位、层级的问题

定位

1、相对定位

是一种占位定位，虽然移动了位置但在标准流的位置还存在，在移动时是z轴空间此时不会影响周围的元素，但是标准流的位置还存在
相对定位元素是计算位置值是相对的元素。 top 和 bottom 属性指定从其正常位置的垂直偏移量； left 和 right 属性指定水平偏移。是相对与现在的位置的偏移量

position:relative;

水平偏移量

left:0;
right:0;

垂直偏移量

top:0;
bottom:0;

2、绝对定位

不占位置，完全脱离标准流，默认参考点是窗口
绝对定位元素是计算位置值为绝对或固定的元素。 top、right、bottom 和 left 属性指定元素包含块边缘的偏移量。 （包含块是元素相对于其定位的祖先。）如果元素有边距，它们将被添加到偏移量中。该元素为其内容建立一个新的块格式上下文 (BFC)。
是相对与父元素bfc的偏移量

position:absolute;
top:0;
left:0;

当left和right同时使用时，以left为准

3、绝对定位相对定位结合使用

绝对定位的参考点：

​ 绝对定位的起始参考点是设置定位的父元素（离自身最近的）

​ 如果没有设置相对定位的父元素，默认参考点是body初始包含块

4、固定定位

​ 将元素设置在浏览器的一个具体的位置，固定定位的参考点永远是浏览器窗口，完全脱离标准流

5、层级

如果有两个盒子盒子里面有分别都有一个子元素，父元素相对定位，子元素绝对定位

​ 此时父元素包含的子元素，父元素和子元素的层级是相同的，就是下面的盒子的层级比上面的盒子的层级要高，要想让父元素中的子元素，上面的子元素压在下面的子元素，这时就要改变父元素的层级，改变子元素的层级没有作用