慕课张鑫旭，笔记之position

1、关于position的relative和absolute的基础使用，两者嵌套时relative下面的absolute相对于relative， 如果没有，就相对于整个页面

2、限制层级  关于absolute，在没有relative限制的情况下，z-index的值越高，层级越高

3、如果有reelative，并且relative设置了层级关系即设置了z-index，那么absolute上面的z-index没有任何的作用、

4、限制超越overflow：hidden对于absolute不管用，如果有relative则有用

5、relative与fixed的关系，只有一个有作用，对于z-index有作用

6、relative与定位： 1、相对自身，相对于自身位置定位的，而绝对定位时相对于容器的（top：0px；left： 0px）

                                 2、无侵入，margin-top：-100px； 和top：-100px，表现形式是一样的，往上偏移100px

                        对于margin的下面的元素也会形成偏移，而对于relative的top则不会动，保持原来的位置

                      无侵入定位的应用：自定义拖拽

7、relative设置对立属性的反应： 1、绝对定位是拉伸   （自己测一下）

                                                      2、相对定位是斗争   top 与bottom  靠近的先气作用

8、relative和层级：     relative与z-index层级

                                  1、提高层叠上下文，都是后面的覆盖前面的，想改变就用position：relative提高级别（）

                                  2、新建层叠上下文与层级控制：relative的z-index设置为auto，对里面的absolute没有限制

9、relative的最小化影响原则 ：指的是尽量降低relative属性对其他元素或布局的潜在影响

                                   1、尽量避免使用relative：

                  absolute定位不依赖于relative，不需要嵌套，position：absolute就好，距离差异用margin进行偏移

                                   2、relative最小化

                 单独设置一个div，与之前的img占据一行类似，然后就使用相对定位的绝对定位来实现，没有任何兼容性问题，不会有层级层叠bug。