0

我正在尝试将图片显示为我的网站的背景,所以我使用以下代码

HTML:

<div>
     <img src="images/background.jpg" id="bg" alt="background_image" />
</div>

CSS:

#bg {
    width: 100%;
    height: 75%;
    position: absolute;
    z-index: -5000;
}

我想知道如何限制背景的大小,因为我不希望它拉伸超过 2000 像素。

谢谢

4

5 回答 5

1

我会使用以下CSS:

html { 
    background: url(images/bg.jpg) no-repeat center center fixed;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

并完全删除您的 div 。

要限制大小,您可以:

#bg {
    min-height: 100%;
    max-width: 2000px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    bottom: 0;
}
于 2013-02-06T03:48:06.180 回答
1

只需在您的 CSS 中包含 max-width 即可。

 #bg {
    width: 100%;
    max-width: 2000px;
    height: 75%;
    position: absolute;
    z-index: -5000;
}
于 2013-02-06T04:23:43.740 回答
0

您可以使用max-width

#bg {
    width: 100%;
    height: 75%;
    position: absolute;
    z-index: -5000;

    max-width: 2000px; /* use this to limit the maximum width */
}
于 2013-02-06T03:47:41.950 回答
0

我还没有测试它,但添加max-width:2000px;到你的#bg 选择器。

于 2013-02-06T03:48:46.540 回答
0

试试这个

#bg {
width: 100%;
height: 100%%;
background-size:100%;
}
于 2013-02-06T03:59:37.123 回答