css让footer永远保持在页面底部

案例1：仅仅保存在页面底部。不固定。

思路：

html：

    <div class="body">
  <header>我是头部</header>
  <div class="content">我是内容</div>
</div>
<footer>我是页脚，我总是固定在页面底部</footer>

        * {
  margin: 0;
  padding: 0;
}
html, body {
  height: 100%; /*让页面撑满窗体*/
}
.body {
  min-height: 100%;
  height: auto !important;
  height: 100%; /*设置页面内容区域最小占满窗体高度*/
  margin: 0 0 -41px; /*利用margin负值留出footer的区域(因为footer设置了1px的border，所以值在原有高度上+1)*/
  text-align: center;
}
footer {
  height: 40px;
  line-height: 40px;
  border-top: 1px solid #ddd;
  text-align: center;

}
        .content{
            width: 100%;
            height: 900px;
        }

固定底部显示：

demo地址：

http://codepen.io/tianzi77/pen/aOrBdb

代码就是加入了

    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;

让他永远在站点底部显示出来！