下記のようなHTMLの構造であったとして説明していきます。

<html>
<body>
   <!-- ▼ページ全体を覆うdiv -->
   <div id="wrapper">

      <div id="header">
         ↑↓ヘッダ箇所
      </div>

      <div id="main">
         ↑↓本文箇所
      </div>

      <div id="footer">
         ↑↓フッタ箇所
      </div>

   </div>
   <!-- ▲ページ全体を覆うdiv -->
</body>
</html>

あとは下記のCSSを追加するだけになります。

#wrapper {
   position: relative;
   min-height: 100%;
}

#main {
   padding-bottom: 100px; /* フッタの高さ分余白を追加 */
}

#footer {
   position: absolute;
   bottom: 0px;
}

※ヘッダやフッタ箇所にmarginのある要素を入れる場合は、marginを0にしておかないと表示がおかしくなる可能性もありますのでご注意ください。