解决在Markdown中的表格单元格合并的问题

Markdown中表格的表达

了解markdown的朋友应该都知道，在md中实现表格是件很容易的事情。如下，
代码表示：

|项目1|项目2|项目3|
|---|---|---|
|a1|a1|a3|
|b1|b2|b3|
|b1|c2|c3|

效果如下：

项目1	项目2	项目3
a1	a1	a3
b1	b2	b3
b1	c2	c3

因此，我们可以看到，由于markdown下对表格的简化使得一些表格细节无法进行处理，例如我们今天提到的单元格合并。

若我们要将上表中的相同文字单元格进行合并，如a1与a1横向合并，b1与b1纵向合并，单纯的markdown语法是不能实现的。由于markdown支持html，我们可以通过表格在html中的table进行实现。

HTML中表格的表达

先来说一下html是怎么实现表格及合并单元格的，先放一下效果。

项目1	项目2	项目3
a1	a2
b1	b2	b3
b1	c2	c3

下面放一下上面表格的html代码，我们可以清楚地看到这是通过table及tr、th、td标签实现了基本的表格，通过td标签下的colspan（跨列）及rowspan（跨行）属性进行单元格的合并。

<table>
  <tr>
    <th>项目1</th>
    <th>项目2</th>
    <th>项目3</th>
  </tr>
  <tr>
    <td>a1</td>
    <td colspan="2">a2</td>
  </tr>
  <tr>
    <td rowspan="2">b1</td>
    <td>b2</td>
    <td>b3</td>
  </tr>
  <tr>
    <td>c2</td>
    <td>c3</td>
  </tr>
</table>

引入HTML时需要注意的

需要注意的一点是，在markdown中使用html代码来实现表格的效果，需要在表格的外面套上

1	<escape></escape>

（转义），防止markdown直接将代码中的行进行转义成回车，不然会出现表格前空了一大块空白。

但同时，引入html会使得markdown的易读易写的特性降低。除非必要，还是推荐使用markdown本身的表格语法。

如何偷懒

那么，我们如何在使用html表格的时候，偷懒不用打这段表格呢？

http://www.tablesgenerator.com/

我安利这个网站，它可以实现你的需求，包括以上说的合并单元格。

如有疑问，可在评论区回复，或点击我的主页侧栏相关联系图标联系我，感谢来到我的博客。

推广文章：