您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

如何在HTML中将一个图像放置在另一个图像之上?

如何在HTML中将一个图像放置在另一个图像之上?

好的,过了一段时间,这就是我的目标:

.parent {

  position: relative;

  top: 0;

  left: 0;

}

.image1 {

  position: relative;

  top: 0;

  left: 0;

  border: 1px red solid;

}

.image2 {

  position: absolute;

  top: 30px;

  left: 30px;

  border: 1px green solid;

}


<div class="parent">

  <img class="image1" src="https://placehold.it/50" />

  <img class="image2" src="https://placehold.it/100" />

</div>

作为最简单的解决方案。那是:

创建一个放置在页面流中的相对div;首先将基本图像作为相对图像放置,以便div知道应该有多大;将叠加层相对于第一张图片左上角作为绝对值放置。诀窍是使亲戚和绝对人正确。

其他 2022/1/1 18:21:30 有694人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶