Html图像在图像上

Question

谁能告诉我,我怎么能在另一个图像,而无需使用添加图像Z-index或Z-order？

Answer 1

如果不确切知道你想要实现什么,很难正确回答,z-index可能不是你真正需要的.例如,以下内容可行:

<div id="container">
    <img src="img1.jpg" id="img1" />
    <img src="img2.jpg" id="img2" />
</div>

#container {
    position:relative;
}

#img2 {
    position: absolute;
    left: 50px;
    top: 50px;
}

您是否使用<img>标签或background-images取决于图像的语义值,即它们是页面的表现形式还是实际内容？

Answer 2

最简单的方法是确保它们的大小相同,一个具有透明度,并使用此代码段:

<img style="background:url(image.jpg)" src="overlay_image.gif" alt="" />

Answer 3

使用background-image属性在CSS中设置主图像的背景图像