先看看浏览器生成table差别。
?
<!DOCTYPE HTML>
<html>
<head>
<title>table.html</title>
<meta http-equiv="content-type" content="text/html; charset=GB18030">
<style type="text/css">
body{padding:1px;margin:1px;}
table{background-color:#aaa;margin-bottom:10px;}
td{padding:0px;margin:0px;background:white;}
tr{height:20px;}
.w_100{ width:100px;}
.w_200{width:200px;}
.w_500{width:500px;}
.content_width{width:500px;height:18px;}
</style>
</head>
<body>
<table width="100%" cellspacing=1>
<tr>
<td colspan="4" ><div class="content_width"></div></td>
</tr>
<tr>
<td colspan="1"></td>
<td colspan="3"></td>
</tr>
<tr>
<td class="w_100"></td>
<td class="w_200"></td>
<td class="w_100"></td>
<td></td>
</tr>
</table>
</body>
</html>
?
?
?
我想要的是这样的table，chrome、firefox、opera中表现是所期待的
?
?
IE8中，浏览器会先确定table的最小宽度，然后按比例增大其他行的td，不论td是否设置了宽度
?
?
生成表格之后，IE8 chrome firefox opera改变浏览器窗口大小，IE8 chrome firefox opera 表现一致，都只会影响没有设置宽度的td，而不会影响设置了宽度td，除非是最后一个td（贴着table右边的那个td）。
?
现在来看下IE6/7的表现
?
?在生成table的方式和IE8一样，但是浏览器窗口缩放表现不一致
table整体都会随着浏览器窗口缩放，无论td是否设置了宽度
?
但当我将table的第一行的那个td设置width属性的时候
?
<td colspan="4" class="w_100"><div class="content_width"></div></td>
?浏览器缩放表现和IE8一样，这可能是IE8对IE67的一些改进（添加width属性对IE8没有影响）
?
暂时到这，如果有问题希望您能指出来，谢谢。