html佈局讓footer始終處在底部

footer處在底部並不是fix在底部（一直在瀏覽器窗口底部）

style文件

//
// Footer沉底
//
html,body{
    height:100%;
}
.container{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -4em;
}
footer{
    height:4em;
}
.pb-80{
    padding-bottom:80px;
}//不加這個是中間的內容的超過整個屏幕的情況下footer會覆蓋文字
//
// End Footer沉底
//

頁面結構必須這樣

<div id="container">
    <div class="pb-80">頁面正文</div>
</div>
<footer>...</footer>

項目親測成功，nice啊

---

2015年6月6日21:14:50

後續開發當然還有各種問題，真正理解這個footer沉底就是，頁面上兩個上下塊，讓上面的塊高度100%；然後再padding-bottom:75px; 這樣就預留出75px的高度給下面的塊,下面的塊設置margin-top:-75px; 根據自己的需要去修改這個高度了，如果出現各種問題，那都是footer的內容給footer撐開了，算好每個像素，沒有問題的。

//
// start Footer 沉底
//
html,body{
    height:100%;
}
.container{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    padding-bottom: 75px;
    /*margin: 0 auto -60px;*/
}

footer{
    margin-top:-75px;
}

//
// End Footer 沉底
//