我有一个叠加图像,我正试图将其定位到其 div 的底部。如果我不设置高度,它会覆盖屏幕(就像它应该的那样)但是太高了。
如果我设置高度,它会从 /image/GH3UT.png 开始至 /image/rjj6D.png .
代码
#home {
height: 600px;
position: relative;
}
.overlay {
position: absolute;
left: 0;
bottom: 0;
width: 100vw;
height: 250px; <- setting this causes it
}
我的 body 里有
body {
position: absolute;
}
HTML代码
<section id="home">
<div class="container-fluid">
<img src="assets/img/shape.svg" class="overlay">
</div>
</section>
提前致谢!
最佳答案
通过设置高度,图像会按照您的指示调整大小。移除高度并在 .overlay
上将您的 bottom
位置设置为您满意的任何负值。
关于css - 设置叠加图像会导致图像缩小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53199273/