CSS背景圖片：頁

在我的網站的底部，我有一個像這樣應用於body元（給予頂部，左側和底部邊框的印象）3張背景圖片：CSS背景圖片：頁

body { 
    background: url('../image/body-x.gif') repeat-x 0 0, 
       url('../image/body-x.gif') repeat-x 0 100%, 
       url('../image/body-y.gif') repeat-y -280px 0; 
    background-color: #47b48e; 
}

這顯示正常大部分時間頁面很長。但在更短的時間 - 比如404模板http://www.mattpealing.co.uk/asdfadsf - body-x.gif沒有堅持到頁面的底部，像這樣：

enter image description here

我試着加入如下代碼（我讀過無數在過去這是一個普遍的解決方案）：

html, body { 
    height: 100%; 
}

但我永遠不能得到那個工作。它仍然不會出現在底部，而是在其他頁面上打破它。如關於頁面上，下邊框圖像在此screengrab重疊體內複製，如：

enter image description here

有人能看到我在做什麼錯？

來源

2014-12-29 pealo86

它看起來像背景圖像有一個純色，所以爲什麼不背景色 –

嘗試：

html, body { min-height: 100% }

來源：Make <body> fill entire screen?

順便說一句，如果你用在身上白色的頂部和底部邊框和只使用了背景圖像左側的白色空間是什麼？這會使代碼更簡單，並減少一些不必要的HTTP請求。

來源

2014-12-29 18:33:18 Darren

謝謝！這似乎很好地工作。另外我甚至沒有想到將頂部和底部設置爲邊界！我已經這樣做了，但現在奇怪的是，我回到了404頁面佈局中的原始問題......它似乎可以很好地處理那裏的圖像和'min-height'屬性！ – pealo86

CSS背景圖片：頁

回答

相關問題