html - 如何在网站内叠加图像 (png)？

Question

我正在尝试将一个图像安装在另一个(稍大)图像的中间，以便它看起来在更大的图像(在本例中为手机)内。我不确定实现这一目标的正确方法，非常感谢任何帮助!

Answer 1

您需要设置 z-index css 属性。

HTML:

<img id="png1" src="png1.png" />
<img id="png2" src="png2.png" />

CSS:

#png1 {
    position:absolute;
    top:0;
    left:0;
    z-index:0;
}

#png2 {
    position:absolute;
    /*
    set top and left here
    */
    z-index:1;
}

这是一个演示:http://jsfiddle.net/AlienWebguy/6VSBv/