tableにおけるcolspan制御


テーブルにcolspanプロパティが追加された場合、colspanが存在するプロパティtdまたはth要素の幅がテーブルの固定幅より大きい場合、テーブルは固定されず、適応されます.
<table border='1' width="100%" style='table-layout: fixed;'>
<tr>
    <td width='100' >1</td>
    <td width='150'>1</td>
    <td>1</td>
</tr>
<tr>
    <td colspan='3'><div style="width:700px;background-color:red;"></div></td>
</tr>
<tr>
    <td>1</td>
    <td>1</td>
    <td>1</td>
</tr>
</table>
この時点で、テーブルの最初の行td widthプロパティは有効ではありません.幅を固定する方法.一般的にテーブルで属性を定義する
table-layout: fixed;固定する
場合によってはcolspanが最初の行の場合、tdでも無効になります.
<table border='1' width="100%" style='table-layout: fixed;'>
<tr>
    <td colspan='3'><div style="width:700px;background-color:red;"></div></td>
</tr>
<tr>
    <td width='100' >1</td>
    <td width='150'>1</td>
    <td>1</td>
</tr>
<tr>
    <td>1</td>
    <td>1</td>
    <td>1</td>
</tr>
</table>

この場合、td幅を制御するには、一番上に以下のコードを付けることができます.
<colgroup>
 
      <col width=60%></col>
       <col width=20%></col>
       <col width=20%></col>
</colgroup>

次のようになります.
<table border='1' width="100%" style='table-layout: fixed;'>
<colgroup>
       <col width='100'></col>
       <col width='150'></col>
       <col ></col>
</colgroup>
<tr>
    <td colspan='3'><div style="width:700px;background-color:red;"></div></td>
</tr>
<tr>
    <td width='100' >1</td>
    <td width='150'>1</td>
    <td>1</td>
</tr>

<tr>
    <td>1</td>
    <td>1</td>
    <td>1</td>
</tr>
</table>
転載:http://blog.sina.com.cn/s/blog_506d9e2001018254.html