|m| 怎么让三个Table分别为上中下排在页面
日期：2014-05-20 浏览次数：20490 次
|m| 如何让三个Table分别为上中下排在页面
我用
<table width= "100% " height= "100% ">
<tr>
<td>
....这里一个Table上
</td>
</tr>
<tr>
<td>
....这里一个Table中
</td>
</tr>
<tr>
<td>
....这里一个Table下
</td>
</tr>
</table>
－－－－－－－－－－－
Table上的高大概是：120px 中为：200px 下为：100px
我想要在页面中的显示效果为：
Table上：在页面最上面
Table下：在页面最下面
Table中：在页面的中间
但不管我怎么设置，Table下，都不会在最下面而是跟在Table中的下面
如果我用固定的如Table上＝120 Table中＝500 Table下＝100
这样虽然可以在我的机子分辨率下ＯＫ但在别的人机子不和我分辨率一样的话就不行了，我要他能自动调整的
谢谢
我要怎么设置
谢谢
------解决方案--------------------
啥意思> 现在不行?
------解决方案--------------------
这三个表格放在三个不同的Div中,用js获取用户屏幕的分辨率后调整div的位置
------解决方案--------------------
呵呵，最近zyciis开头的帐号 的问题很多呀！
------解决方案--------------------
去掉: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 然后: <TABLE width= "100% " border= "1 " height= "100% "> <TR> <TD style= "background:red;height:120px; "> ....这里一个Table上 </TD> </TR> <TR> <TD height= "100% " > <TABLE width= "100% " style= "background:blue;height:200px; "> <TR> <TD> 中 </TD> </TR> </TABLE> </TD> </TR> <TR> <TD style= "background:green;height:100px; "> ....这里一个Table下 </TD> </TR> </TABLE>
------解决方案--------------------
现在都什么年代了，还搞那么复杂的 <table /> 嵌套排版，这样就行啦：
----------------------------
<!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=utf-8 " />
<title> ABC </title>
</head>
<body>
<div style= "position: absolute; top: 0; height: 120px "> 表格1 </div>
<div style= "position: absolute; top: 120px; height: 200px "> 表格2 </div>
<div style= "position: absolute; bottom: 0; height: 100px "> 表格3 </div>
</body>
</html>
----------------------------
在IE7和FF2中测试有效，在IE6中如果无效的话就要做一些调整了，记住别把那个doctype去掉。
------解决方案--------------------
提醒你一件事，这3个区域加起来高度420px，如果浏览器可视区域高度院大于这个值，界面将会很难看，因为中间一大片空白；如果小于这个值，将会出现重叠（根据你的规则，而不是CSS有问题）。
我用
<table width= "100% " height= "100% ">
<tr>
<td>
....这里一个Table上
</td>
</tr>
<tr>
<td>
....这里一个Table中
</td>
</tr>
<tr>
<td>
....这里一个Table下
</td>
</tr>
</table>
－－－－－－－－－－－
Table上的高大概是：120px 中为：200px 下为：100px
我想要在页面中的显示效果为：
Table上：在页面最上面
Table下：在页面最下面
Table中：在页面的中间
但不管我怎么设置，Table下，都不会在最下面而是跟在Table中的下面
如果我用固定的如Table上＝120 Table中＝500 Table下＝100
这样虽然可以在我的机子分辨率下ＯＫ但在别的人机子不和我分辨率一样的话就不行了，我要他能自动调整的
谢谢
我要怎么设置
谢谢
------解决方案--------------------
啥意思> 现在不行?
------解决方案--------------------
这三个表格放在三个不同的Div中,用js获取用户屏幕的分辨率后调整div的位置
------解决方案--------------------
呵呵，最近zyciis开头的帐号 的问题很多呀！
------解决方案--------------------
去掉: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> 然后: <TABLE width= "100% " border= "1 " height= "100% "> <TR> <TD style= "background:red;height:120px; "> ....这里一个Table上 </TD> </TR> <TR> <TD height= "100% " > <TABLE width= "100% " style= "background:blue;height:200px; "> <TR> <TD> 中 </TD> </TR> </TABLE> </TD> </TR> <TR> <TD style= "background:green;height:100px; "> ....这里一个Table下 </TD> </TR> </TABLE>
------解决方案--------------------
现在都什么年代了，还搞那么复杂的 <table /> 嵌套排版，这样就行啦：
----------------------------
<!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=utf-8 " />
<title> ABC </title>
</head>
<body>
<div style= "position: absolute; top: 0; height: 120px "> 表格1 </div>
<div style= "position: absolute; top: 120px; height: 200px "> 表格2 </div>
<div style= "position: absolute; bottom: 0; height: 100px "> 表格3 </div>
</body>
</html>
----------------------------
在IE7和FF2中测试有效，在IE6中如果无效的话就要做一些调整了，记住别把那个doctype去掉。
------解决方案--------------------
提醒你一件事，这3个区域加起来高度420px，如果浏览器可视区域高度院大于这个值，界面将会很难看，因为中间一大片空白；如果小于这个值，将会出现重叠（根据你的规则，而不是CSS有问题）。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
