关于HTML＜table＞标签如何合并单元格

主要是利用td标签或者th标签的rowspan（行合并）colspan（列合并）两个属性。

我们以程序实例来说明：

1.首先构建一个表格如图

<table border="1" style="height: 200px;width: 200px;">
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td >4</td>
            <td>5</td>
            <td>6</td>
        </tr>
        <tr>
            <td>7</td>
            <td>8</td>
            <td>9</td>
        </tr>
    </table>

运行结果如图所示：

2.使用colspan列合并合并第一行的所有列

<table border="1" style="height: 200px;width: 200px;">
        <tr>
            <td colspan="3">1</td> <!--注意此处的td标签由原来的三个变为一个-->
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
        <tr>
            <td>7</td>
            <td>8</td>
            <td>9</td>
        </tr>
    </table>

运行结果如图所示：

3.使用rowspan（行合并）合并第一列的所有行

<table border="1" style="height: 200px;width: 200px;">
        <tr>
            <td rowspan="3">1</td><!--使用rowspan进行合并-->
            <td>2</td>
            <td>3</td> 
        </tr>
        <tr>
            <td>4</td>
            <td>5</td><!--注意此处的只有两列 td标签变为2个-->
        </tr>
        <tr>
            <td>7</td>
            <td>8</td><!--注意此处的只有两列 td标签变为2个-->
        </tr>
    </table>

运行结果如下：

如此就通过rowspan和colspan实现了表格的行列合并。

一定要注意的是，合并之后td标签的行列数的变化。否则会得不到预期结果，只相当于占位。