Css 为什么我的横幅图像在100%的div中崩溃？

这一次，我在客户的要求下尝试使用slick banner lib，我的图像似乎在div内部以100%宽度和500px高度折叠。我希望它能重新缩放到500像素的高度。是否环顾四周，并似乎按照建议行事

---

通过使用下面的代码，可以获得完全响应的图像。仅使用背景图像时：封面；图像没有完全响应，在自身上崩溃。下面的css是有效的

.background-image-3 {
 width: 100%;
 height: 500px;
 position: relative;
 background-image: url("http://www.cucoders.com/images/background.png");
 background-size: cover;
 background-attachment: scroll;
 background-position: 50% 0px;
 overflow: hidden;
}

---

我会使用CSS背景图像，背景大小为：封面请提供您的代码。@DBS-如果背景为100%宽度和固定高度，图像将不会使用“背景大小：封面”重新调整大小。。。它应该调整大小，这有点像

封面

，它覆盖了可用的区域。@DBS-如果使用固定高度的封面，则图像不是完全响应的，会从一个设备看向另一个设备。为了解决这个问题，我们增加了：背景位置：50%0px；溢出：隐藏；我在前两张幻灯片上禁用了上述属性，并将其保留在下面的第一个链接上，如果您想查看结果的话。你的答案很接近，只是遗漏了两行重要的css，以保持图像比例为1:1。

.background-image-3 {
 width: 100%;
 height: 500px;
 position: relative;
 background-image: url("http://www.cucoders.com/images/background.png");
 background-size: cover;
 background-attachment: scroll;
 background-position: 50% 0px;
 overflow: hidden;
}