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;

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