合并表格单元格可以使表格更加美观,也可以有效地减少表格的行数和列数。在CSS3中,大家使用rowspan
和colspan
属性来合并表格单元格。
使用rowspan
合并表格的行,大家可以将多个单元格合并为一个单元格。例如,下面的代码将表格的第一列的前三行合并为一个单元格:
<table> <tr> <th rowspan="3">姓名</th> <th>语文</th> <th>数学</th> </tr> <tr> <td>85</td> <td>90</td> </tr> <tr> <td>92</td> <td>88</td> </tr> </table>
使用colspan
合并表格的列,大家可以将多个单元格合并为一个单元格。例如,下面的代码将表格的第一行的前两列合并为一个单元格:
<table> <tr> <th colspan="2">学生列表</th> <th>总分</th> </tr> <tr> <td>张三</td> <td>90</td> <td>180</td> </tr> <tr> <td>李四</td> <td>88</td> <td>176</td> </tr> </table>
通过这些简单的代码,大家可以轻松地合并表格单元格,使表格看起来更加整洁,易于阅读。