如何在頁面小於窗口時將HTML背景強制爲底部

我有一個包含2個背景圖像的頁面，其中一個需要顯示在頁面的最底部。目前，我已經實現了它這樣的：如何在頁面小於窗口時將HTML背景強制爲底部

body { 
    background-image: url('/cheri/image/background.png'), 
         url('/cheri/image/backgroundB.png'); 
    background-position: top, bottom; 
    background-repeat: repeat-x, repeat-x; 
}

能正常工作時，頁面內容比瀏覽器窗口更高，但如果是小的一個空白空間在這張照片留下的背景圖像的下方，如：

http://img198.imageshack.us/img198/4560/screenshot20120916at851.png

我試圖設置身體的位置是：絕對的，身高：100％，但它並沒有被正確渲染滾動時存在。我也嘗試爲背景圖像創建一個單獨的div，並將其完全放置在底部，但由於底部出現的某些元素的位置屬性不同，因此z-indexing無法正常工作。

感謝您的幫助！

來源

2012-09-16 ValtsBlukis

multipe圖像將在下面的Internet Explorer（9.0） –

由於創建問題，但我可以解決這個問題。無論我使用2個背景圖像還是1個，這個問題都存在。.. – ValtsBlukis

看起來你可能沒有正確設置背景位置，它需要爲每個背景設置一個像「左上角」的參數。你可能應該爲背景位置設置的是「0 top，0 bottom」 – DrCord

使用min-height: 100%兩個html和body：

html, body { min-height: 100%; }

DEMO

它創建沒有問題，當你有足夠的內容來引起滾動。背景圖像中

DEMO

來源

2012-09-16 10:56:58 Ana

設置HTML元素，以及：

html { 
    background-image: url('/cheri/image/background.png'), url('/cheri/image/backgroundB.png'); 
    background-position: top, bottom; 
    background-repeat: repeat-x, repeat-x; 
}

來源

2012-09-16 06:14:34

如何在頁面小於窗口時將HTML背景強制爲底部

回答

相關問題