CSS问题 — — 定位 层级

参考资料：https://www.mscto.com/css/433758.html （css定位position引发的层级关系问题详解）
https://developer.mozilla.org/zh-CN/docs/Web/CSS/position

postion属性

概念：用于指定一个元素在文档中的定位方式
常见语法：static | relative | absolute | sticky | fixed

取值

• static：该关键字指定元素使用正常的布局行为，即元素在文档常规流中当前的布局位置。此时 top, right, bottom, left 和 z-index 属性无效。就是所谓的默认布局。
  
• relative 相对定位
  该关键字下，元素先放置在未添加定位时的位置，再在不改变页面布局的前提下调整元素位置（因此会在此元素未添加定位时所在位置留下空白）。position:relative 对 table-*-group, table-row, table-column, table-cell, table-caption 元素无效。
  通俗的说就是相对于自身原本的位置的偏移，不影响其他元素的布局。
  
• absolute 绝对定位 非常常用
  元素会被移出正常文档流，并不为元素预留空间ÿ