gpt4 book ai didi

html - 让JPG图片贴在网页底部不拉伸(stretch)

转载 作者:行者123 更新时间:2023-11-28 12:30:45 26 4
gpt4 key购买 nike

大家好,我正在尝试将图像贴在我网站的底部。我可以让它粘在底部但随后它会拉伸(stretch)...这是我的代码:

<style>
img {
position: fixed;
bottom: 0;
}
</style>
<img src="fire.jpg" width="100%" height="100%" />

它不会很好地粘在我的网页底部并随着网页大小的变化而改变尺寸,它只是四处拉伸(stretch)。所有其他的 Stack Overflow 技巧都是一样的。感谢您的帮助。

最佳答案

我想你想要的是这个:

<style>
.background-img {
position: fixed;
top: 0;
bottom: 0;
width: 100%;
background-image: url(/images/fire.jpg);
background-size: cover; /* or "contain" */
background-position: center bottom;
}
</style>

<body>
<div class="background-img"></div>
<div class="content">
...
</div>
</body>

很难让图像按照您的要求执行而不会出现失真或不希望出现的垂直高度问题。

关于html - 让JPG图片贴在网页底部不拉伸(stretch),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28683208/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com