.pinkDiv {
position: relative;
width: 100%;
height: 40vh;;
background-color: pink;
}
.miniDiv {
position:relative;
}
.p1 {
position:absolute;
}<div class="pinkDiv">
<div class ="miniDiv">
<img src="https://dummyimage.com/200x150/ff00ff/fff.png" class = "p1" style="background-color:green;">
</div>
</div>调整浏览器窗口大小时，图像的位置会更改。我希望它贴在顶部的粉红色div上，并在调整窗口大小时随之移动。我也尝试过分配相对于pink div和mini div的位置，以及将绝对位置分配给img，没有任何效果。所以，这就是我所拥有的（另请参见附件图片）：
https://i.stack.imgur.com/m3w6n.png
https://i.stack.imgur.com/hvwwg.png
在注释部分运行代码片段并调整窗口大小时：
这是代码。请检查一下。希望对您有帮助。如果有任何更改，请告诉我。
.pinkDiv {
position: relative;
width: 100%;
height:100px;
background-color: pink;
}
.miniDiv {
width:100px;
}
img{
width: 100%;
height: auto;
}<div class="pinkDiv">
<div class="miniDiv">
<img src="https://dummyimage.com/200x150/ff00ff/fff.png" class="p1" style="background-color:green;">
</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句