zl程序教程

您现在的位置是:首页 >  其它

当前栏目

关于Markdown表格中如何进行换行、合并单元格

如何 进行 关于 合并 表格 markdown 换行 单元格
2023-09-14 09:14:59 时间

1、表格中内容对齐、换行

常规表格使用
一般我们都会这样用表格如下:

| 姓名 | 年龄 |  爱好 |
| -- | -- | -- |
| 小明 | 9 | 篮球 |
| 小刚 | 10 | 篮球、足球 |

效果如下:

姓名年龄爱好
小明9篮球
小刚10篮球、足球

设置对齐方式

|:–:|居中对齐、|:–|左对齐、|–:|右对齐。

| 姓名 | 年龄 |  爱好 |
| :--: | :-- | --: |
| 小明 | 9 | 篮球 |
| 小刚 | 10 | 篮球、足球 |

效果如下:

姓名年龄爱好
小明9篮球
小刚10篮球、足球

表格内容换行

Markdown本身不提供单元格换行,但是,Markdown是兼容HTML的,因此,我们可以通过HTML的方式实现单元格换行。

| 姓名 | 年龄 |  爱好 |
| :-- | :-- | :-- |
| 小明 | 9 | 篮球 |
| 小刚 | 10 | 篮球 <br> 足球 |

效果如下:

姓名年龄爱好
小明9篮球
小刚10篮球
足球

2、表格中单元格的合并

合并单元格还是要与HTML网页结合起来,来达到效果。

这会用到HTML的标签:

  • colspan:规定单元格可纵深的列数

  • rowspan:规定单元格可横跨的行数

合并表格行

<table>
    <tr>
        <td></td>
        <td></td>
    <tr>
    <tr>
        <td colspan="2">姓氏</td>
    <tr>
</table>

效果如下:

姓氏

合并表格列

<table>
    <tr>
        <td>类别</td>
        <td>名称</td>
    </tr>
    <tr>
        <td rowspan="2">颜色</td>
        <td>红色</td>
    </tr>
    <tr>
        <td>黄色</td>
    </tr>
    <tr>
        <td rowspan="2">姓氏</td>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
</table>

效果:

类别名称
颜色红色
黄色
姓氏

综合使用

<table>
    <tr>
        <td>类别</td>
        <td>名称</td>
    </tr>
    <tr>
        <td rowspan="2">颜色</td>
        <td>红色</td>
    </tr>
    <tr>
        <td>黄色</td>
    </tr>
    <tr>
        <td colspan="2">姓氏</td>
    </tr>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

效果:

类别名称
颜色红色
黄色
姓氏

参考自:https://www.jianshu.com/p/b6c85800c44e