在网页设计中，常常需要在一张图片上放置另一张图片。这个需求通常是为了对原有的图片进行修饰、装饰或者标识。CSS提供了多种实现方法，其中最常用的是通过绝对定位来将两张图片放在同一位置。

<div class="container">
<img src="original.jpg" alt="原始图片">
<img src="overlay.png" alt="覆盖图片">
</div>
.container {
position: relative;
}
img {
position: absolute;
top: 0;
left: 0;
}
img:last-of-type {
z-index: 1;
}

在这段代码中，我们首先将两张图片都放在同一div容器中，并设置了覆盖图片的z-index值为1，让它显示在原始图片的上方。然后，通过将父容器的position属性设为relative，以及子元素的position属性设为absolute，将两张图片都定位在了容器的左上角。

如果需要使后面的图片在一个元素上实现透明遮罩，可以设置其背景为半透明rgba值或者使用遮罩层。

绝对定位在美化网页时应该比较常见，它有多种应用，包括图片上的图片、放置菜单或工具栏、部分滚动页面和控制元素位置。熟悉绝对定位，可以帮助我们更好地实现复杂的网页布局。