使用CSS重叠两个透明图像

Pie*_*rre 4 css transparency image overlap

我试图让两个透明图像(具有相同的尺寸/尺寸)div在它们的左上角处重叠.我试过了:

<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div style="margin:20px;">
<div id="main" style="overflow:hidden;background-color:red;width:400px;height:400px;border:3px solid blue;">
<img src="myimage1.png" style="position:relative;top:0px;left:0px;z-index:0;"/>
<img src="myimage2.png" style="position:relative;top:0px;left:0px;z-index:10;"/>
</div>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

但这不起作用.相反,这两张图片在父母中连接在一起div.

ken*_*ytm 6

尽量让#mainposition:relative,然后改变两个<img>的使用position:absolute.

  • 打败了我 - 这是一个实例http://jsbin.com/unogu3/(我偏移图像显示它们重叠 - 显然你的会有所不同) (2认同)