原因: 的表格,各列寬度由第一行決定,后面指定的寬度會被忽略。你第一行合并了,所以各列寬度均分了。
解決方法一:
在tbody前加
<col style="width: 60%" />
<col style="width: 20%" />
<col style="width: 20%" />
解決方法二:
設置一個隱藏的行來規(guī)定寬度:
<table style=";width:200px" border="1" cellspacing="1" cellpadding="1">
<tr style="display:none">
<td style="width:100px"></td>
<td style="width:80px"></td>
<td style="width:20px"></td>
</tr>
<tr>
<td>1</td>
<td colspan="2">2</td>
</tr>
<tr>
<td>1.1</td>
<td>2.1</td>
<td>2.2</td>
</tr>
</table>
這個方法,在IE6,IE7,IE8中都可以正確地顯示,但在非IE中,是沒起作用的。下面給出另外一種方法:
<style>
td{border:1px solid red;}
</style>
<table style=";width:200px" border="0" cellspacing="1" cellpadding="1">
<tr style="height:0;">
<th style="width:100px"></th>
<th style="width:80px"></th>
<th style="width:20px"></th>
</tr>
<tr>
<td>1</td>
<td colspan="2">2</td>
</tr>
<tr>
<td>1.1</td>
<td>2.1</td>
<td>2.2</td>
</tr>
</table>