你可以将图像与位置对齐：相对于具有位置的图像：绝对吗？

Question

我在页面上有两张图片。第一个图像的位置为：relative，第二个图像位于第一个图像的正下方，其中position：absolute。是否可以将第二张图像与另一张图像对齐，以便它们在放大或缩小时的相对位置保持不变？

Answer 1

如果使用浏览器进行缩放，则崩溃元素位置是一种普通情况。所以我建议你不要过多关注它。但无论如何，您的图像必须具有相同的父级，具有“位置：相对”。

HTML

<div class="myImageContainer">
    <img class="positionedRelative" src="" alt="" />
    <img class="positionedAbsolute" src="" alt="" />
</div>

CSS

.myImageContainer { position: relative; }
img.positionedRelative { position: relative; } /* not necessary, try to remove */
img.positionedAbsolute { position: absolute; left: 0; top: 0; }

左：0;顶部：0; - 插入自己的值。

Answer 2

Something like this？