css - 网页背景

Question

在我的元素中，我使用图像作为 body 的背景。我在 css 中使用以下代码:-

body{
    /*background:#000;*/
    margin:0px;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:14px;
    color:#000;
    background:url(../images/stripBG.jpg);
    background-repeat: repeat-x repeat-y;
}

这个背景图像是 strip ，我在 x 和 y 轴上重复它以使其出现在整个页面上。但是当某些内容加载到我的页面时，在一定高度之后，背景再次重复。

如何使背景与我的动态内容兼容

Answer 1

您可以按照以下方式做一些事情:

CSS

html, body {
    background: url(../images/stripBG.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin:0px;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:14px;
}

JS Fiddle