这几天看很多朋友问道这方面的问题，于是着手解决一下，刚刚自己做了个示例，
测试了通过了IE5/IE5.5/IE6/FF1.5/OPERA 8/，没有采用IE的 Quirks 模式：
代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> *{ margin:0; padding:0; } html{ padding:0 !important; padding:100px 0; width:100%; height:100%; overflow:hidden; } body{ padding:100px 0; padding:/**/0; height:100%; overflow: hidden; } #header{ position:absolute; top:0; width:100%; height:100px; background:#ccc; line-height:100px; text-align:center; } #middle{ position: absolute!important; position: relative; top:100px!important; top:0; bottom:100px; width:100%; height:auto!important; height:100%; background:#ffc; text-align:center; overflow: auto; } #footer{ position:absolute; bottom:0; width:100%; height:100px; background:#ccc; line-height:100px; text-align:center; } </style> <title>自适应100％高度</title> </head> <body> <div id="header">页首</div> <div id="middle"> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> 页中<br /> </div> <div id="footer">页脚</div> </body> </html>
前一篇:网站建设美丽反而要失宠!龙华网页制作
后一篇:龙华外贸网站建设如何正确的选择主机服务器
