HTML_合并单元格

首先我们创建一个3行3列的表格：

<table border="1px" width="400px" height="300px" style="text-align: center">
        <tr>
            <td>1td>
            <td>2td>
            <td>3td>
        tr>
        <tr>
            <td>4td>
            <td>5td>
            <td>6td>
        tr>
        <tr>
            <td>7td>
            <td>8td>
            <td>9td>
        tr>
    table>

横向合并单元格：
我们就合并单元格1和2，横向合并单元格在td标签中使用colspan属性，属性值为需要合并单元格的个数，同时将被合并的单元格td删除，如下：

<table border="1px" width="400px" height="300px" style="text-align: center">
        <tr>
            <td colspan="2">1td>
            <td>3td>
        tr>
        <tr>
            <td>4td>
            <td>5td>
            <td>6td>
        tr>
        <tr>
            <td>7td>
            <td>8td>
            <td>9td>
        tr>
    table>

纵向合并单元格：
我们就合并单元格4和7，纵向合并单元格在td标签中使用rowspan属性，属性值为需要合并单元格的个数，同时将被合并的单元格td删除，如下：

<table border="1px" width="400px" height="300px" style="text-align: center">
        <tr>
            <td colspan="2">1td>
            <td>3td>
        tr>
        <tr>
            <td rowspan="2">4td>
            <td>5td>
            <td>6td>
        tr>
        <tr>
            <td>8td>
            <td>9td>
        tr>
    table>

横向+纵向合并单元格：
我们就合并单元格5 6 8 9，合并单元格在td标签中同时使用colspan属性和rowspan属性，属性值分别为横向和纵向需要合并单元格的个数，同时将被合并的单元格td删除，如下：

<table border="1px" width="400px" height="300px" style="text-align: center">
        <tr>
            <td colspan="2">1td>
            <td>3td>
        tr>
        <tr>
            <td rowspan="2">4td>
            <td colspan="2" rowspan="2">5td>
        tr>
        <tr>
        tr>
    table>