CSS基础 定位相关属性的使用方法

1.相对定位：position：relative；
     属性名：position
        属性值：relative；   
特点：1.相对自己的位置移动
     2.配合方位名词移动，如：top、left、right，bottom
     3.相对定位，位置虽然移动了，但原来的位置还在，并未脱标
应用场景：
     1.配合绝对定位使用（子绝父相）
     2.小范围的移动使用

2.绝对定位：position：absolute；
 特点：1.默认相对浏览器可视化区域的边缘移动，如果父级以及以上级有定位，则相对最近的一个级定位
      2.配合方位名词移动
      3.位置移动，原来的位置已经不存在，已脱标

3.1.子绝父相 （为什么不是子绝父绝那？答案：如果父元素也是绝对定位的话，父元素将会脱标，如果下方在部署盒子，将置顶部署，打乱了原有的部署需求）
在祖先元素使用相对定位：position：relative；
自身是绝对定位：position：absolute；
根据自己需求将相对定位给哪个一个祖先元素设置

3.2子绝父绝的应用场景
注意：如果在使用子绝父相的时候，发现父元素已经有绝对定位了，此时直接使用绝对定位即可
   原因：父元素已经满足子绝父相，已经满足要求，如果有改动的话，会影响到之前布局效果

4.position:fixed;固定定位
 特点：1.配合方位使用;top、bottom、right、left
      2.使用过程中已脱标，不占用位置；
      3.相对浏览器可视区域移动；

5.总结：<相关定位元素的层级关系>
  5.1 标准流< 浮动< 定位元素（默认相对、绝对、固定，层级相同，html会根据css前后区分谁在上谁在下）
  5.2 提升定位元素层级关系属性：z-index：数字；数字越大层级越高