頁腳底部有一個帶有固定標題的頁腳

Question

當內容太小時，我想讓我的頁腳停留在頁面底部（我不想在頁面中間看到我的頁腳）。

我按照這里和那里的教程描述了相同的技術（最小高度：容器的100％，頁腳的明顯高度等）。

問題是所有這些東西都不起作用，因為碰巧我有一個固定的標題，這意味着我的實際內容開始於body + 130px

body{
  padding-top: 130px;
}

結果是，是的，我的頁腳位於底部但是，我仍然可以滾動130px更多。

我看到的所有教程和問題都沒有固定的標題。

謝謝你們

Answer 1

默認模型是內容框，為height:100%;的元素添加padding-top height:100%; 將使其高度100% + 130px 。

所以你必須添加另一個帶有自動高度的<div>包裝器並添加它padding-top: 130px;

<html style="height:100%;">
<body style="height:100%; margin:0; position:relative;">
    <div id="wrapper" style="min-height:100%;">
        <div id="container" style="padding-top:130px; padding-bottom:130px;">
        </div>
    </div>
    <div id="footer" style="position:absolute; bottom:0; height:130px;">
    </div>
</body>
</html>

Answer 2

嘗試添加margin-top:-130px; 到您的頁腳容器。

頁腳底部有一個帶有固定標題的頁腳

問題描述

2 個解決方案

解決方案1
2 已采納 2011-11-12 22:49:37

解決方案2
0 2011-11-12 22:52:07

頁腳底部有一個帶有固定標題的頁腳

問題描述

2 個解決方案

解決方案1 2 已采納 2011-11-12 22:49:37

解決方案2 0 2011-11-12 22:52:07

解決方案1
2 已采納 2011-11-12 22:49:37

解決方案2
0 2011-11-12 22:52:07