Table tags in HTML-merge cells

Merge cells
in two ways: 1) interbank combined; 2) across columns combined;
target cell (to be merged cell, writing merged cell code):
1) interbank: target cell is the uppermost cell;
2 ) Cross-column: the leftmost cell in the target cell;
small steps for merging cells:
1) Determine how the cells are merged: across rows or columns;
2) Find the target cell and write the code;
3) Delete the excess Cell.
As shown in Figure 1, a 3 * 3 table:
Insert picture description here
merge the cells,
Insert picture description here
as shown in Figure 2: merge the 2 , 3 cells in the first row as shown in the figure, and merge the 4, 7 cells in the first column Together, the
code example:

<p>合并单元格</p>
<table align="center" border="1" cellpadding="50" cellspacing="0" >
    <tbody align="center">
    <tr>
        <td>1</td>
        <td colspan="2">2</td>  <!--确定跨列合并的目标单元格为2号单元格,写下代码-->
        <!--<td>3</td>-->       <!--合并后,3号单元格就是多余的,将之删除-->
    </tr>
    <tr>
        <td rowspan="2">4</td>   <!--确定跨行合并的目标单元格为4号单元格,写下代码-->
        <td>5</td>
        <td>6</td>
    </tr>
    <tr>
        <!--<td>7</td>-->       <!--确定7号单元格为跨行合并后多余的单元格,将之删除-->
        <td>8</td>
        <td>9</td>
    </tr>
    </tbody>
</table>
Published 13 original articles · won 2 · views 324

Guess you like

Origin blog.csdn.net/weixin_46410264/article/details/104599099