一个不错的CSS DIV布局,DIV高度自适应

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WiseInfo</title>
<style type="text/css">
<!--
* {
 margin:0px;
 padding:0px;
}
html, body {
 height:100%;
 overflow: hidden;
}
html>body {   /*-- for !IE6.0 --*/
 width: auto;
 height: auto;
 position: absolute;
 top: 0px;
 left: 0px;
 right: 0px;
 bottom: 0px;
}
body {
 border:8px solid #ffff00;
 background-color: #ffffff;
}
#mainDiv {
 width: 100%;
 height: 100%;
 _padding-left:160px;
}
#rightDiv {
 width: 100%;
 height: 100%;
 _padding:100px 0px;
}
#mainDiv>#rightDiv {
 width:auto;
 position:absolute;
 left:160px;
 right:0px;
}
#leftDiv {
 width:156px;
 height:100%;
 background-color:#99FF33;
 position:absolute;
 top:0px;
 left:0px;
}
#centerDiv {
 width: 100%;
 height: 100%;
 background-color:#00CCFF;
}
#rightDiv>#centerDiv {
 height:auto;
 position:absolute;
 top:100px;
 bottom:100px;
}
#topDiv {
 height:96px;
 width:100%;
 background-color:#9933FF;
 position:absolute;
 top:0px;
}
#bottomDiv {
 height:96px;
 width:100%;
 background-color:#FF9900;
 position:absolute;
 bottom:0px;
 _bottom:-1px; /*-- for IE6.0 --*/
}
-->
</style>
</head>
<body>
<div id="mainDiv">
  <div id="leftDiv"></div>
  <div id="rightDiv">
    <div id="topDiv"></div>
    <div id="centerDiv" style="overflow:auto;"> 阿飞撒旦发啊是发送方啊沙发
      <h1 style="width:3000px; height:2000px; background-color:#F00;"></h1>
    </div>
    <div id="bottomDiv"></div>
  </div>
</div>
</body>
</html>

出自http://bbs.blueidea.com/viewthread.php?tid=2818595&extra=page%3D1%26amp%3Bfilter%3Drate

posted @   94cool  阅读(249)  评论(0编辑  收藏  举报
编辑推荐:
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 【杭电多校比赛记录】2025“钉耙编程”中国大学生算法设计春季联赛(1)
历史上的今天:
2011-11-20 DateTime.ToString("dd/MM/yyyy");后,不能直接Convert.ToDateTime的解决:
2011-11-20 Jquery easyui dialog组件, 默认不自动打开
< 2012年11月 >
28 29 30 31 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 1
2 3 4 5 6 7 8
点击右上角即可分享
微信分享提示