如果页面宽度超过图像宽度，我如何使横幅图像伸展以适合页面的宽度？

（这是绿色的大横幅图像。）

现在我在宽度上限图像在2560px，并且直到4K革命来临时，应该是罚款。但是，如果有人出于某种原因（通过多台显示器？）将其伸展得更宽一些，我希望它不像目前那样重复，但是要将图像的宽度拉长以适合。

这是可能通过CSS来做，而不需要JavaScript？

那我SASS的一部分，只是看起来像这样：

.banner { 
    @include box-shadow(rgba(0, 0, 0, 0.30) 0 4px 10px 0); 
    background: url(../images/banner-bg.jpg); 
    height: 522px;

我将如何做到这一点？

2013-07-19 Doug Smith

地址：

background-size: cover;

这可以确保图像将覆盖整个区域，在你的情况下，图像将几乎总是保持其高度，直到旗帜的宽度比图像的原始宽度，那么它将开始扩大以适应宽度。如果有人将他们的浏览器扩展到这个尺寸，但在这个宽度上没有多大意义，它不会看起来很完美。

2013-07-19 00:54:55 Godwin

回答