背景上的固定元素

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像素。