使用Table将各个控件进行定位，如下：<table>
<tr>
<td>
<div>div1</div>
</td>
<td>
<div>div2<div>
<div>div3<div>
</td>
</tr>
</table>要实现div1高度100%，宽度50%,div2、div3高度各是50%，宽度50%
要求页面不出现滚动条，随浏览器大小更改高宽。td中的不一定是div，也可能是其它元素（如文本框、frame等）我需要的最终效果大致是：
写一个公用的函数，传递一个参数，参数是一个JSON数组，每一个元素具有：
id(控件id)，height(传递一个百分比数), width(传递一个百分比数)
然后在页面的onresize中调用这个函数，实现各个控件的自动调整大小。
要注意浏览器的边距，控件之间也可能存在margin不知道讲清楚了没有，我搞了几天都没有达到想要的效果。拜托各位了！！
<tr>
<td>
<div>div1</div>
</td>
<td>
<div>div2<div>
<div>div3<div>
</td>
</tr>
</table>要实现div1高度100%，宽度50%,div2、div3高度各是50%，宽度50%
要求页面不出现滚动条，随浏览器大小更改高宽。td中的不一定是div，也可能是其它元素（如文本框、frame等）我需要的最终效果大致是：
写一个公用的函数，传递一个参数，参数是一个JSON数组，每一个元素具有：
id(控件id)，height(传递一个百分比数), width(传递一个百分比数)
然后在页面的onresize中调用这个函数，实现各个控件的自动调整大小。
要注意浏览器的边距，控件之间也可能存在margin不知道讲清楚了没有，我搞了几天都没有达到想要的效果。拜托各位了！！
function RedirectPage() {
var table = document.getElementById("Table-data");
var menu = document.getElementById("Table-menu");
var h = screen.height
var str = 1;
if (h > 768) {
table.style.height = (705 + (1024 - h) * (-1)).toString();
menu.style.height = (746 + (1024 - h) * (-1)).toString();
}
else if (h < 768) {
table.style.height = (705 - (1024 - h)).toString();
menu.style.height = (746 - (1024 - h)).toString();
}
else {
table.style.height = "450px";
menu.style.height = "491px";
}
}把你数字改成你想要的就可以了，另外getElementById是标签的ID，自己对应修改，你标签的ID就好了
div2、div3高度各是50%
div1在第一列中，div2和div3在第二列中。
td的高度呢？宽度呢？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>
<title>无标题文档</title>
<style type="text/css">
body,html
{
overflow:auto;
height:100%;
}
body
{
margin:0px;
padding:0px;
}
.layoutGrid
{
height:100%;
width:100%;
border-collapse:collapse;
}
</style>
</head><body>
<table class="layoutGrid">
<tr>
<td style="height:100%; padding:0px; width:50%;">
<div style="background-color:#F0F0F0;height:100%">div1</div>
</td>
<td style="height:100%; padding:0px; width:50%">
<div style="background-color:#F0FFF0;height:50%">div2</div>
<div style="background-color:#FFF0F0;height:50%">div3</div>
</td>
</tr>
</table>
</body>
</html>
<div style="height:50%;background-color:#ccc;">
head
</div>
<div style="width:100%;height:50%;">
<div style="float:left;width:50%;background-color:green;display:block;height:100%;">
left
</div>
<div style="margin-left:50%;;height:100%;">
right
</div>
</div>
</BODY>