网页代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""><html xmlns=""><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>CSS布局：上中下三栏自适应高度CSS布局</title><STYLE type="text/css">*{margin:0;padding:0;}body, html { margin: 0; padding:0 !important; padding:90px 0 32px 0; width:100%; height:100%; overflow:hidden;}.header {background: #C9F;width: 100%;height: 90px;overflow: hidden;position: absolute;top: 0;width: 100%;text-align: center;background-color: #FFCC00;}.content { position:absolute!important; position:relative; top:90px!important; top:0; bottom:32px; width:100%; overflow:hidden; height:auto!important; height:100%; left: -3px;}.main { height:100%; background:#66CCFF; overflow-y:auto; text-align:center;}.footer {background: #9CF;width: 100%;height: 40px;color: #e1efff;line-height: 32px;letter-spacing: 1px;text-align: center;clear: both;position: absolute;bottom: 0;left: 0;background-color: #FF6600;}</STYLE></head><body><!– 代码 开始 –><div class="header"><br/>这里是顶部</div><div class="content"><div class="main"><br /><br />网页header和footer高度是固定的，中间的content高度自适应浏览器窗口高度代码，随着窗口的大小变动都是满屏的。</div></div><div class="footer">这里是底部</div><!– 代码 结束 –></body></html>效果截图
版权声明：本文为博主原创文章，，未经博主允许不得转载。
而只有在充满了艰辛的人生旅途中，
