当前位置：文江博客话题详情

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

发布于 2024-11-14 17:49:11 字数 93 浏览 3 评论 0原文

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

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

寂寞美少年 2024-11-21 17:49:11

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

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； - 插入您自己的价值观。

If you zoom with your browser, crashing elements position is an ordinary situation. So I'd not advise you to pay so much attention to it. But in any case your images must have the same parent, that has "position: relative".

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; }

left: 0; top: 0; - insert your own values.

回复收藏 0 原文