footer随能容高度，固定到底部Sticky footers

第一种是flex布局

http://www.w3cplus.com/css3/css-secrets/sticky-footers.html

第二种普通方法布局

<div id="wrap"><div id="main" class="clearfix"><div id="content"></div><div id="side"></div></div></div><div id="footer"></div>

html, body, #wrap {height: 100%;}body > #wrap {height: auto; min-height: 100%;}#main {padding-bottom: 150px;}  /* 必须使用和footer相同的高度 */#footer {position: relative;margin-top: -150px; /* footer高度的负值 */height: 150px;clear:both;}

.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}.clearfix {display: inline-block;}/* Hides from IE-mac \*/* html .clearfix { height: 1%;}.clearfix {display: block;}/* End hide from IE-mac */