html - 为什么背景图像没有根据屏幕尺寸做出响应？

Question

我已经使用 twitter bootstrap 制作了一个网页。 我通过 CSS 在背景中插入了一个图像，如下所示。

<div class="container-fluid">
    <div class="row-fluid">
        <section id="wrapper">

        </section>
    </div> 
</div>

CSS如下:

section#wrapper{ 
    max-width:700px; 
    background-image:url("img/crane.png");
    min-height:525px;
}

当我调整浏览器大小时，图像没有根据屏幕大小调整大小。 我不知道如何让它响应。 所以请任何人帮助我解决这个问题。 提前致谢。

Answer 1

试试这个

section#wrapper{ 
    background:url("img/crane.png") no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}