CSS三行三列DIV高度自适应的设置

【 tulaoshi.com - Web开发 】

　　用脚本控制三行三列div高度自适应的设置方法，其实不必如此麻烦，只要给父div设置一个固定高度，比如10px,其子div的height:100%就可实现高度自适应，不信，看代码：

head
style
body {
　　font-family: arial, helvetica, sans-serif;
　　color: black;
　　margin: 5px;
background:#ffc url(d:/8767a.gif) repeat-y;
　　padding: 0;
font:12px;
letter-spacing:1px;
　text-align:center;
font:120%;
}
ul
{
list-style-type:square;
list-style-image:url(d:/8767a.gif);
list-style-position:inside;
}
li
{
border:1px green solid;
border-width:0px 0px 1px 0px;
cursor:wait;
}
.inline
{
display:block;
}
.div
{
　 paddin-top:-40px;
}
.maxfont
{
font-size:180%;
}
#header
{
background:gray;
margin:2px 0px;
width:790px;
}
#left
{
　　 background:#ffeef0;
float:left;
width:195px;
height:100%;
}
#middle
{
　background:#ffaae0;
float:left;
　 width:390px;
　 margin:0px 5px;
height:100%;
}
#right
{
　 background:#ffaaaa;
　float:left;
　width:195px;
　width:-10px;
height:100%;
}
#footer
{
　background:#ffaa11;
　clear:both;
　width:790px;
　margin:1px 0px;
}

　　亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。

　　亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；拒绝提供

　　这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。

　　/div

　　div id="middle"

　　如果设计者使用像素为单位指定文字大小，大多数的用户将无法缩放文字，因为 Internet Explorer 改变文字大小的方式与别的浏览器不同。Mozilla 和 Opera 可以缩放已经设定像素大小的文字，而Windows下的IE却不能。

/div
/div
/div
div id="footer" 欢迎访问：www.devdao.com/div
/body