固定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背景圖像

回答

相關問題