Javascript 如何将一张图片与另一张图片叠加？

用HTML、CSS或jQuery将图片与另一张图片重叠的好方法是什么？

有几种方法

将一个图像设置为容器上的背景，并将另一个图像放入其中

将一个图像置于另一个图像之上（可能是相对的，但几乎肯定是绝对的）

玩负利润游戏

---

哪一个最好取决于你想要达到的目标（包括你想要表达的语义）。

最简单的是CSS定位。绝对将图像放置在同一位置。确保父DIV处于相对位置（或不是默认位置），以便图像的绝对位置位于父DIV而不是窗口内。这应该适用于几乎所有支持CSS的浏览器

HTML:

如果您想确保图像完全相互覆盖，还可以使用CSS设置高度和宽度，或者您可以确保图像大小相同，或者顶部的图像比下面的图像大（顶部和底部取决于HTML或z索引中的顺序）

html:

---

什么是最流行的跨浏览器？第二个？@dave-真的。你试过[马赛克]（）？；）我知道这听起来很愚蠢，但是有没有办法把背景图像放在上面呢？你必须开始在你的.box中处理绝对定位和特定的类。CSS有点冗长，我会在一段时间后将其作为一个新的答案发布。

<div id="gallery">
    <img src="..." ... />
    <img src="..." ... />
</div>

#gallery { position: relative; }
#gallery img { 
    position: absolute;
    top:0;
    left:0; }

<div class="box">
  <img src="background.jpg" class="under" alt="" />
  <img src="overlay.jpg" class="over" alt="" />
</div>

.over {
    position:absolute;
    z-index:100;  
}

.under {
    position:absolute;
    z-index:99;
}

.box {
    position:relative;
}