背景上的固定元素

Question

我正在试图制作一种从上面其他div元素后面出现的页脚。

An example is the Pitchfork website with the footer on the bottom.

我试图做到这一点在CSS：

#footer { 
    overflow: hidden; 
} 
#footer .text { 
    position: fixed; 
} 

或者，我可以把它固定，通过设置网站的总高度将它移动到页面的底部。但这只是复杂的。

任何想法或简单的教程如何做到这一点？

Answer 1

试试这个：

#footer { 
    position:fixed; 
    left:0px; 
    bottom:0px; 
    height:30px; 
    width:100%; 
    background:#999; 
} 

/* IE 6 */ 
* html #footer { 
    position:absolute; 
    top:expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px'); 
} 

Answer 2

分配此CSS页脚：

footer { 
    position: fixed; 
    bottom: 0; 
    left: 0; 
    width: 100%; 
    z-index: -1; 
    height: 150px; /* vaue as needed */ 
} 

这个修复它在左下，并把它与其它元素的后面（的z-index -1）

此外，您必须添加尽可能多的margin-bottom到文档流中的最后一个元素作为页脚的高度，以便内容可以滚动到页脚上方，在我的示例中150像素。