【发布时间】：2020-07-31 10:20:42
【问题描述】：
我已经阅读堆栈溢出有一段时间了，但这是我的第一篇文章！
我有这个网站：https://oliv-collection.com/。
只要您查看它的屏幕分辨率小于 1600 像素（原始图片宽度），顶部的横幅就是全宽的。一旦分辨率大于该分辨率，横幅就不会覆盖页面的整个宽度。
有没有一种简单的 CSS 方法可以增加宽度和高度以覆盖整个宽度？我一直在与 Google Inspector 斗争，但不知道该怎么办！
谢谢
【问题讨论】：
【发布时间】：2020-07-31 10:20:42
【问题描述】：
你应该使用
width: 100%;
无论屏幕的宽度是多少，横幅都将具有最大宽度。
【讨论】：
可能有更好的方法可以做到这一点，但我通过将横幅图像的样式更改为以下内容，实现了接近您要求的内容：
.slick-slider .nm-banner img, .nm-banner img {
display: inline-block;
width: 100%;
}
我所做的是将width: auto; 替换为width: 100% 以使图像正确调整大小，并删除max-width: 100%; 和height: auto;。通过我的更改，横幅图像将随着屏幕宽度的增加而增加，甚至超过 1600 像素。这适用于 macOS 上的 Safari。
【讨论】：