Question

如果您滚动到页面外的内容，如何在CSS中获取Body Background图像以保持固定。我放了一个小提琴：http://jsfiddle.net/eSALE/7/

这是我目前的CSS正文代码：

body { 
background: url('http://s22.postimg.org/u9jjshrfl/nature_desktop_background_wallpapers.jpg') no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

请参阅其余代码的小提琴。

Answer 1

删除

background-color: #333;

在CSS样式表开头的'html，body {}'下。

编辑：您真正需要做的就是删除样式表中的顶级HTML，以便样式显示：

body {
    background #333;
}

如评论中所述，如果无法显示背景图像，则会以后备方式完成。

Answer 2

从body标签中删除背景图片并添加到site-wrapper

.site-wrapper {
      display: table;
      width: 100%;
      height: 100%; /* For at least Firefox */
      min-height: 100%;
      background: url('http://s22.postimg.org/u9jjshrfl/nature_desktop_background_wallpapers.jpg') no-repeat center center fixed; 
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
    }

DEMO

Answer 3

这是问题的解决方案

 body{ 
   background: url('http://s22.postimg.org/u9jjshrfl/nature_desktop_background_wallpapers.jpg');
    background-repeat:no-repeat;

    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position:center center;
    background-attachment:fixed;

    }

fiddle

Answer 4

这应该可以解决问题..........

    html {
         background: url('http://s22.postimg.org/u9jjshrfl/nature_desktop_background_wallpapers.jpg') no-repeat center center fixed; 
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

这是更新的小提琴......

http://jsfiddle.net/xcKs9/1/

CSS Body背景图片已修复

4 个答案: