如何实现3个table垂直并列，并自适应浏览器高度100%？

最新推荐文章于 2022-11-11 08:55:10 发布

piperzero

最新推荐文章于 2022-11-11 08:55:10 发布

阅读量1.8k

点赞数

分类专栏：网站建设文章标签： table 浏览器 javascript generator header div

网站建设专栏收录该内容

740 篇文章 1 订阅

订阅专栏

 
 如何实现3个table垂直并列，并自适应浏览器高度100%？ 
三个table局就是上、中、下,上面和下面的table高度固定；中间的table自动适应浏览器的高度。 
不要出现滚动条，不要用table或div外面嵌套，无论浏览器大小如何，上下两个table都能看见，中间的自动缩放大小。 
<!doctype html public "-//w3c//dtd html 4.0 transitional//en"> 
<html> 
<head> 
<title></title> 
<meta name="generator" content="editplus"> 
<meta name="author" content="Ariex"> 
<meta name="keywords" content=""> 
<meta name="description" content=""> 
<style type="text/css"> 
body{margin:0px;padding:0px;overflow:hidden;padding-top:22px;padding-bottom:22px;} 
div{margin:0px;padding:0px;} 
#header{background-color:blue;color:white;position:absolute;top:0px;left:0px;height:16px;width:100%;} 
#content{background-color:yellow;width:100%;height:100%;overflow:auto} 
#footer{background-color:green;color:white;width:100%;height:16px;position:absolute;bottom:0px;left:0px;} 
</style> 
<script language="javascript"> 
</script> 
</head> 
<body> 
<div id="header">header</div> 
<div id="content"> 
<script language="javascript"> 
for(i=0;i<1000;i++){ 
document.write(i+"<br />"); 
} 
</script> 
</div> 
<div id="footer">footer</div> 
</body> 
</html> 
 

http://www.corange.cn/archives/2008/10/1913.html <script type="text/javascript"> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>