固定CSS背景图像

即使您滚动页面上的内容，您如何在CSS中获取正文背景图像以保持固定。我已经把小提琴起来：http://jsfiddle.net/eSALE/7/固定CSS背景图像

这是我目前的身体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; 
}

见捣鼓代码的其余部分。

来源

2014-03-28 Jake Bolam

删除

background-color: #333;

下 'HTML，身体{}' 在你的CSS样式表的开始。

编辑：你真正需要做的是去除顶部HTML中的样式表，样式上写着：

body { 
    background #333; 
}

正如评论所说，这是作为一个后备做，如果背景图像不能被显示。

来源

2014-03-28 07:39:31

真正需要的回退'背景color'的情况下，背景图像不可用，删除等是确定的，但它应该被移到仅适用于“身体”的风格。这个问题是由设置'html'标签的'background-color'引起的，这很有趣（有点奇怪）？但不是真的，通过反复试验，我发现它需要2个条件：**'''''''''''''''''''''height'设置为'100％'''html'具有'背景彩色'集合，奇怪。 –

国王，你说得对，我应该提到这一点。我从来没有见过HTML的背景颜色设置。 –

这绝对是疯狂的。但是，将背景颜色放在html标签上是我的错。感谢您指出了这一点！ –

这应该做的伎俩..........

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/

来源

2014-03-28 07:34:02 winnyboy5

取出从背景图像身体标记，并添加到站点包装

.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

来源

2014-03-28 07:36:31

这是problum的解决方案

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

来源

2014-03-28 07:44:15 Mehar

固定CSS背景图像

回答

相关问题