多表头表格

表格多表头模式,参见：http：//www.360ui.net

双表头

实现以下：

<table class="tableStyle" useCheckBox="true" useMultColor="true"> <tr> <th rowspan="2" class="th_m2" ></th> <th colspan="2" class="th_m" >第一组</th> <th colspan="3" class="th_m" >第二组</th> <th colspan="2" class="th_m" >第三组</th> </tr> <tr> <th width="10%" class="th_m">性别</th> <th width="5%" class="th_m">年龄</th> <th width="20%" class="th_m">工做</th> <th width="15%" class="th_m">联系方式</th> <th width="20%" class="th_m">住址</th> <th width="10%" class="th_m">婚姻情况</th> <th width="10%" class="th_m">操做</th> </tr> <tr> <td width="5%"><input type="checkbox" value="1"/></td> <td>男</td> <td>25</td> <td>软件设计师</td> <td>15012546548</td> <td>天津市和平区</td> <td>已婚</td> <td><span class="img_view hand" title="查看"></span><span class="img_edit hand" title="修改"></span><span class="img_delete hand" title="删除"></span></td> </tr> <tr> <td><input type="checkbox" value="2"/></td> <td>男</td> <td>25</td> <td>软件设计师</td> <td>15012546548</td> <td>天津市和平区</td> <td>已婚</td> <td><span class="img_view hand" title="查看"></span><span class="img_edit hand" title="修改"></span><span class="img_delete hand" title="删除"></span></td> </tr> </table>

 

三表头

实现以下：

<table  class="tableStyle" useCheckBox="true" useMultColor="true">

  <tr>

    <th rowspan="3" class="th_m3"></td>

    <th colspan="4" class="th_m">星期一</th>

    <th colspan="4" class="th_m">星期二</th>

    <th colspan="4" class="th_m">星期三</th>

  </tr>

  <tr>

    <th colspan="2" class="th_m">上午</th>

    <th colspan="2" class="th_m">下午</th>

    <th colspan="2" class="th_m">上午</th>

    <th colspan="2" class="th_m">下午</th>

    <th colspan="2" class="th_m">上午</th>

    <th colspan="2" class="th_m">下午</th>

  </tr>

  <tr>

    <th class="th_m">第1节</th>

    <th class="th_m">第2节</th>

    <th class="th_m">第3节</th>

    <th class="th_m">第4节</th>

    <th class="th_m">第1节</th>

    <th class="th_m">第2节</th>

    <th class="th_m">第3节</th>

    <th class="th_m">第4节</th>

    <th class="th_m">第1节</th>

    <th class="th_m">第2节</th>

    <th class="th_m">第3节</th>

    <th class="th_m">第4节</th>

  </tr>

  <tr>

    <td><input type="checkbox" value="1"/></td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

  </tr>

  <tr>

    <td><input type="checkbox" value="2"/></td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

    <td> </td>

  </tr>

</table>