不太理解这个定位

Question

#allcanvas{ position: relative; width: 800px; height: 600px; margin: 0px; } #canvas1{ position: absolute;                top: 0;                left: 0;                z-index: 1; } #canvas2{    position: absolute;                top: 0;                left: 0;                z-index:0 ; }

Answer 1

一般的绝对定位定位，外层都是包一个相对。

因为absolute相对于父级元素定位。不占用原来的位置。

望采纳！

Answer 2

你没写HTML怎么写的 我猜是#canvas1，#canvas2都嵌套在#allcanvas里面，这样#allcanvas作为父级元素position属性设置为relative（相对位置），#canvas1，#canvas2两个子元素position设置为absolute（绝对位置），

这样做，#canvas1，#canvas2就可以相对于#allcanvas的位置保持不变，具体的相对位置 可以设置#canvas1，#canvas2的top，right，left，bottom四个属性来做到。

比如

#canvas1{

position: absolute;

                top: 0;

                left: 0;

                z-index: 1;

}

这个代码表示 #canvas1 位置保持在与#allcanvas左上角对齐的位置，另外，#canvas1的z-index属性比#canvas2大，所以显示的时候 从上层到下层依次是 #canvas1，#canvas2.  。#canvas1会遮挡 #canvas2的一部分