如何对齐表格

现在想做一个动态的表格,在这个一行两列的表格中,左右列里都放入表格,并可以保证左列表格里左右行的高度和等于右列表格里所有行的高度和,但画出的页面中,两个列里的表格为何不一边高呢?有什么办法在行高都不变的情况下,可以充满整个列,使表格对齐么? 请大家帮帮忙吧!谢谢了html代码如下<table width="790" border="1" cellpadding="0" cellspacing="0" style="height:200px">
<tr>
<td>
<table style="width: 100%;height: 340px;" border="1">
<tr style="height: 22px">

<td width="124" rowspan="11" class="tlistb01_2">PR表</td>
<td class="tlistb01_3" colspan="2">日期</td>
<td class="tlistb01_3" colspan="2">人员</td>
</tr>
   <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-02-01</td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px"></td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px"></td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-01-02</td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px"></td>
<td class="tablelistc" colspan="2" style="height:30.8px">--</td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-02-01</td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-02-01</td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px"></td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-11-02</td>
<td class="tablelistc" colspan="2" style="height:30.8px">pr</td></tr>

  <tr>
<td class="tablelistc" colspan="2" style="height:30.8px">2010-02-01</td>
<td class="tablelistc" colspan="2" style="height:30.8px"></td></tr>


</table>
</td>
<td>
<table class="tablestyle" style="width: 100%;height: 308px;" border="1">
<tr style="height: 100%">
<td width="95" rowspan="15" class="tlistb01_2">CS表</td>
<td class="tlistb01_3" style="height:22px">日期</td>
</tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px"></td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-08</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px"></td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-08</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

  <tr><td class="tablelistc" style="height:22.0px">2010-02-02</td></tr>

</table>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

兩邊的列數要一樣多，高度也要一樣，但如果欄位內容過多，還是無法對齊。<html>
<head>
<style type="text/css">
.tlistb01_3{
height:22px
}
.tlistb01_2{
height:22px
}
.tablelistc{
height:22px
}
</style>
</head>
<body>
<table width="790" border="1" cellpadding="0" cellspacing="0" style="height:200px">
<tr>
<td>
<table style="width: 100%;height: 100%px;" border="1">
<tr style="height: 22px">
<td width="124" rowspan="15" class="tlistb01_2">PR表</td>
<td class="tlistb01_3" >日期</td>
<td class="tlistb01_3" >人员</td>
</tr>
<tr>
<td class="tablelistc" >2010-02-01</td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc">2010-01-02</td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc">--</td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc">2010-11-02</td>
<td class="tablelistc">pr</td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
</table>
</td>
<td>
<table class="tablestyle" style="width:100%;height:100%;" border="1">
<tr>
<td rowspan="15" class="tlistb01_2">CS表</td>
<td class="tlistb01_3">日期</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-08</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-08</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-02</td>
</tr>
</table>
</body>
</html>
萬無一失的方法就是合併。<html>
<head>
<style type="text/css">
.tlistb01_3{
height:22px
}
.tlistb01_2{
height:22px
}
.tablelistc{
height:22px
}
</style>
</head>
<body>
<table width="790" border="1" cellpadding="0" cellspacing="0" style="height:200px">
<tr>
<td width="124" rowspan="15" class="tlistb01_2">PR表</td>
<td class="tlistb01_3" >日期</td>
<td class="tlistb01_3" >人员</td>
<td rowspan="15" class="tlistb01_2">CS表</td>
<td class="tlistb01_3">日期</td>
</tr>
<tr>
<td class="tablelistc" >2010-02-01</td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-01-02</td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc">--</td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-11-02</td>
<td class="tablelistc">pr</td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc">2010-02-01</td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
<tr>
<td class="tablelistc"> </td>
<td class="tablelistc"> </td>
<td class="tablelistc">2010-02-02</td>
</tr>
</table>
</body>
</html>
楼上的真快啊
<table width="701" height="384" border="1" align="center">
  <tr>
    <td width="344"><table width="345" height="378" border="1" align="center">
      <tr>
        <td width="77" rowspan="11"> PR表 </td>
        <td width="168"> 日期 </td>
        <td width="78"> 人员 </td>
      </tr>
      <tr>
        <td> 2010-02-01 </td>
        <td> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td> 2010-01-02 </td>
        <td> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td> 2010-02-01 </td>
        <td> </td>
      </tr>
      <tr>
        <td> 2010-02-01 </td>
        <td> </td>
      </tr>
      <tr>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td> 2010-11-02 </td>
        <td> </td>
      </tr>
      <tr>
        <td >2010-02-01 </td>
        <td> </td>
      </tr>
    </table></td>
    <td width="341"><table width="341" height="376" border="1" align="center">
      <tr>
        <td width="54" rowspan="15"> CS表 </td>
        <td width="271"> 日期 </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td> </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td>2010-11-08</td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td> </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td>2010-11-08</td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td height="24">2010-11-02 </td>
      </tr>
      <tr>
        <td>2010-11-02 </td>
      </tr>
      <tr>
        <td height="29">2010-11-02 </td>
      </tr>
    </table></td>
  </tr>
</table>
最简单的方法是嵌套<table>。多层嵌套，每个table自己定义高宽，总能对齐的