2-14. 单元格合并

作者: 一Left一 | 来源:发表于2017-11-09 21:12 被阅读7次

2-14. 单元格合并
合并单元格，取消合并单元格并填充
Excel小技巧：Excel中合并单元格如何填充序号？
学习Web前端（表格）的第一天
CSS笔记16：border-collapse
基础(四)--创建语义化界面(二)
实用的Excel函数
两个excel小技巧（2020-04-04）
excel技巧之单元格合并
Excel 实用方法

1、水平方向合并

特点：向右合并
colspan
td标签的属性
值代表当前td向右作为几个td
要删除多出来的td
例如:
<td colspan="2"></td>
含义：把当前单元格当做两个单元格来看待

2、垂直方向合并

合并特点：向下合并
rowspan
td标签的属性
值代表当前td向下作为几个td
要删除多出来的td
例如:
<td rowspan="2"></td>
含义: 把当前单元格当做两个单元格来看待

注意点:

由于把某一个单元格当做了多个单元格来看到, 所以就会多出一些单元格, 所以需要删掉一些单元格才能正常显示
一定要记住单元格合并永远都是向后或者向下合并, 而不能向前或者向上合并

<body>
<!--
需求: 第一行的第2列和第3列合并为一个单元格,怎么办?
colspan: 设置个哪一个单元格,值是几,哪一个单元格就会水平向右变成几个单元格的宽度
总结: colspan
     水平向右进行扩展
     1. 要合并n个单元格,就要删除n-1个单元格,要删除的是要进行扩展的单元格(设置了colspan=n的这个单元格)后面的单元格
     2. 要给要给某一个单元格设置colspan=n
-->

<table bgcolor="gray" width="300" height="150" cellspacing="1">
    <tr bgcolor="white">
        <td></td>
        <td colspan="2"></td>
    </tr>
    <tr bgcolor="white">
        <td colspan="2"></td>
        <!--<td></td>-->
        <td></td>
    </tr>
    <tr bgcolor="white">
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr bgcolor="white">
        <td colspan="3"></td>
        <!--<td></td>-->
        <!--<td></td>-->
    </tr>
</table>
<br>
<hr>

<!--
纵向合并单元格:
合并的方向垂直向下
rowspan: 设置个哪一个单元格,值是几,哪一个单元格就会垂直向下变成几个单元格的宽度
    1. 设置rowspan属性, 设置在要合并的单元格的第一个,要合并n个单元格,值就是n
    2. 删除多出来的单元格,删除n-1个单元格
-->

<table bgcolor="gray" width="300" height="150" cellspacing="1">
    <tr bgcolor="white">
        <td rowspan="2"></td>
        <td></td>
        <td rowspan="4"></td>
    </tr>
    <tr bgcolor="white">
        <!--<td></td>-->
        <td rowspan="3"></td>
        <!--<td></td>-->
    </tr>
    <tr bgcolor="white">
        <td></td>
        <!--<td></td>-->
        <!--<td></td>-->
    </tr>
    <tr bgcolor="white">
        <td></td>
        <!--<td></td>-->
        <!--<td></td>-->
    </tr>
</table>
</body>