CSS页脚分离

Question

我的页面上有一个固定的页脚，它由文本组成，没有背景图像。我还有一个固定的背景图像，位于右下角。当我向下滚动页面时，我正在徘徊我可以做什么以防止我的内容与页脚和背景图像重叠。在滚动的时候还有填充它们之间吗？

Answer 1

您可以将页脚的高度填充到主容器中。像这样：

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

这会阻止内容位于固定页脚之下。

编辑：这是小提琴 - http://jsfiddle.net/2KZyv/ 当您到达页面底部时，由于容器上的底部填充，页脚不在内容的顶部。

Answer 2

页脚上可能有白色背景，导致透明的固定页脚必然会出现重叠问题。至于右下方的背景图片，只需添加一个z-index代码并将其全部推回，您就可以将所有内容放在最上面。