表格的合并

html代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <!--
        表格的合并
            colspan : 跨列 
            rowspan : 跨行
    -->
    <table border="1px" width="400px">

        <tr>
            <td colspan="2">11</td>
            <td>13</td>
            <td>14</td>
        </tr>

        <tr>
            <td>21</td>
            <td colspan="2" rowspan="2">
                <table border="1px" width="100%">
                    <tr>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                    </tr>
                    <tr>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                    </tr>
                </table>
            </td>
            <td>24</td>
        </tr>

        <tr>
            <td>31</td>
            
            <td>34</td>
        </tr>

        <tr>
            <td>41</td>
            <td>42</td>
            <td>43</td>
            <td rowspan="2">44</td>
        </tr>

        <tr>
            <td>51</td>
            <td>52</td>
            <td>53</td>
        </tr>

    </table>
</body>
</html>
View Code

效果:

原文地址:https://www.cnblogs.com/believepd/p/10008447.html