Question

请你看一下This Demo，让我知道为什么我无法将保存级别为黄色背景的div layer2覆盖为其他layer1和{{1} }}？

这是我的代码：

Canvas

由于

Answer 1

this fiddle你想要什么？你有一个职位和z-index问题

#canvas-wrap {
    position:relative;
    width:500px;
    height:500px
}
#canvas-wrap #myCanvas {
    position:absolute;
    top:0;
    left:0;
    z-index:1;
}
#layer1 {
    position: relative;
    width:500px;
    height:500px;
    background-image: url('http://i1275.photobucket.com/albums/y443/Behseini/c1f7a913-898d-44aa-ad4a-c73a9cbc5823_zpsb0a0136c.png');
    background-repeat: no-repeat;
    z-index:10;
}
#layer2 {
    top:0px;
    position:absolute;
    height:100%;
    width:100%;
    background-color:yellow;
}

Answer 2

这是因为#layer1消耗了画布上的空间。 #layer2正在推动该图层，无法向上移动。

因此，为了进行#layer2叠加，您需要设置其position:absolute;和top:0px，如本演示所示：http://jsfiddle.net/8F2G8/6/

关于HTML5画布背景下叠加两个分区的问题

2 个答案: