html - 如何将一张图片的特定位置叠加在另一张图片之上

Question

我需要在有基本图标/图像的网页上创建网页，然后我想在顶部放置彩色圆点和/或另一个较小的图标在基本图像上的特定位置。最好的方法是什么？就点/图像的正确位置而言，我可能需要在 Javasricpt 中执行此操作。 这是我开始玩的地方 谢谢!

<div style="position: relative; left: 0; top: 0;">
  <img src="a.jpg" style="position: relative; top: 0; left: 0;"/>
  <img src="b.jpg" style="position: absolute; top: 30px; left: 70px;"/>
</div>

Answer 1

要添加到 pranesh answer 上，正确定位叠加图像的最简单方法是让两个图像大小相同，这样当您将它们都设置为: 上:0，左:0 它们会正确显示。

另一种选择是使用 Canvas 。