CSS頁腳分隔

Question

我的頁面上有一個固定頁腳，它由文本組成，沒有背景圖片。我也有一個固定的背景圖片，位於右下方。當我向下滾動頁面時，我正在徘徊我可以做什麼來防止我的內容與頁腳和背景圖像重疊。無論如何，當我滾動時填充它們之間的填充？

Answer 1

您可以將填充頁腳的高度放到主容器中。類似這樣的：

.footer { height: 150px; } 
.container { padding-bottom: 150px; } 

這將防止內容在固定頁腳下。

編輯：這是小提琴 - http://jsfiddle.net/2KZyv/ 當您到達頁面的底部時，由於容器底部的填充，頁腳不在內容的頂部。

Answer 2

你可以在頁腳上有一個白色背景，因爲有一個透明的固定頁腳必然會產生重疊問題。至於右下角的背景圖片，只需包含一個z-index的代碼，並將其推回到最上方，即可獲得頂部的所有內容。