css定位
-
一个div分层
position属性
-
static默认值， 待在文档流里
-
relative相对定位，升起来，但不脱离文档流
-
absolute绝对定位，定位基准是祖先元素非static
-
fixed固定定位，定位基准是窗口
-
sticky粘带定位，
如果你写了absolute，一般都要在祖先元素写relative 如果你写了absolute和fixed，一般要补top和left sticky兼容性很差
层叠上下文
层叠上下文(stacking context)，是HTML中一个三维的概念。在CSS2.1规范中，每个盒模型的位置是三维的，分别是平面画布上的X轴，Y轴以及表示层叠的Z轴。一般情况下，元素在页面上沿X轴Y轴平铺，我们察觉不到它们在Z轴上的层叠关系。而一旦元素发生堆叠，这时就能发现某个元素可能覆盖了另一个元素或者被另一个元素覆盖。
如果一个元素含有层叠上下文，(也就是说它是层叠上下文元素)，我们可以理解为这个元素在Z轴上就“高人一等”，最终表现就是它离屏幕观察者更近。
具象的比喻：你可以把层叠上下文元素理解为理解为该元素当了官，而其他非层叠上下文元素则可以理解为普通群众。凡是“当了官的元素”就比普通元素等级要高，也就是说元素在Z轴上更靠上，更靠近观察者
z-index属性（改变层级）
z-index 改变层级，默认值auto。不会创建层级上下文
position配合 z-index 改变层级
经验：absolute是相对于relative定位的
某些浏览器如果不写top/left会位置错乱
善用left：100%
善于left：50%；加fumargin
手机上尽量不要用z-index这个属性，坑很多
z-index:10和z-index:5n那个高
1，前者 2，后者 3，一样高 4，看情况
还可以写z-index负值
