1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>经典页面布局,任何分辨率下,全屏显示</title> 6 <style type="text/css"> 7 *{ list-style:none; margin:0; padding:0;} 8 html{ height:100%; overflow:hidden;} 9 body{ background:red; height:100%;} 10 .top,.left,.right,.bottom{ background:#000; position:absolute;} 11 .top{ height:70px; left:10px; top:10px; right:10px;} 12 .left{ width:300px; left:10px; top:90px; bottom:90px;} 13 .right{ left:320px; right:10px; top:90px; bottom:90px;} 14 .bottom{height:70px; left:10px; right:10px; bottom:10px;} 15 </style> 16 <!--[if IE 6]> 17 <style type="text/css"> 18 html{ padding:90px 10px;} 19 .top,.left,.right,.bottom{ position:relative; top:0; right:0; bottom:0; left:0;} 20 .top{margin-top:-80px;} 21 .left{height:100%;margin-top:10px; float:left;} 22 .right{height:100%; margin:10px 0 0 320px;} 23 .bottom{margin-top:10px;} 24 </style> 25 <![endif]--> 26 </head> 27 <body> 28 <div class="top"></div> 29 <div class="left"></div> 30 <div class="right"></div> 31 <div class="bottom"></div> 32 </body>> 33 </html>