CSS 定位补充

1、定位叠放次序

在使用定位布局时，有可能出现盒子叠盒子的情况，此时，可以使用 z-index 来控制盒子的次序。

div {
  position: absolute;
  z-index: 1;
}

z-index 的数值可以是正整数、负整数或 0，默认是 auto。数值越大，盒子越靠上；数值相同，则按照书写顺序后来者居上。

只有定位的盒子才有 z-index 属性。

绝对定位/固定定位的盒子会完全压住下面的盒子，而浮动元素只会压住它后面标准流的盒子，而不会压住盒子里面的文字或图片，因为浮动最初产生的目的就是为了做文字环绕的效果。

2、偏移量属性的冲突

如果一个定位的盒子既有 left 属性，又有 right 属性，则默认会执行 left 属性，同理，如果盒子同时有 top、bottom 的属性，默认执行 top 属性，忽略 bottom 属性。