0

我正在使用 javascript 在浏览器调整大小时调整 div 的大小，并在页面加载时对其进行初始设置。（是的，我知道它需要优雅地降级。）我不能全部通过 CSS 完成的原因是因为在屏幕顶部有一个固定高度的固定导航栏需要考虑在内。我想调整 div（及其渐变背景）的大小以适应浏览器窗口，但是当我更改 CSS 高度属性时，它只是切断了图像而不是调整它的大小，这意味着页面的下一部分将无法正确转换。有一个简单的解决方法吗？

这是我现在使用的 CSS：

    #homepage_aboutstrip {
        background-image:url('home/images/gradient-about-background.png');
        background-repeat:repeat-x;
        position:absolute;
        margin-top:0px;
        width:100%;
        height:1050px;
        z-index:1;
    }

并且使用 IMG 标签而不是 background-images 显然会起作用，但这不是一个选项。

4

2 回答 2

3

您可以使用单行 css 来完成。试试这个，如果它有效

background-image:url('home/images/gradient-about-background.png');
background-size: cover

如果扩展过多，可能会影响图像质量

于 2013-04-21T16:54:53.330 回答
1

它在 IE7 上也适用于我。

background: url(../img/url.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
   -moz-background-size: cover;
     -o-background-size: cover;
        background-size: cover;
background-position: 0 40px; /* Only if you want clip out space for fixed navbar */
于 2013-04-21T17:02:54.163 回答