拉伸图像以填充浏览器窗口的宽度

Question

我有一个图像，无论窗口大小如何，我都希望宽度填满浏览器窗口。

我如何在 HTML 和 CSS 中执行此操作？

原文由 Billjk 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以添加一个宽度和高度为 100% 的 div，也可以将图像的宽度和高度设置为 100%

 <div id="wrapper">
    <img src="https://picsum.photos/200/200">
</div>​​​​​​​​​​

CSS：

 #wrapper, img{
    width:100%;
    height: 100%;
}

小提琴手

原文由 sbagdat 发布，翻译遵循 CC BY-SA 4.0 许可协议