markdown表格的合并单元格

Posted by wyj on February 18, 2020

markdown不支持表格合并,严重影响了使用Typora出题的体验。然而我Google了一圈,没有md的解决方案。只好研究一下html该怎么写了。

Solution?

应该使用<table>标签。表头是<thead><tr><th>内容</th></tr></thead>,内容是<tbody><tr><td>内容</td></tr></tbody>。每一行都有一对<tr></tr>。横向的合并单元格是colspan="数字",纵向的是rowspan="数字"。这和LaTeX里面的\multicolumn\multirow很像。

默认的html渲染是不会有边框的;如果设置了边框就会变得像原版Lemon的result.html一样丑了。然而完全不用担心,因为Typora会给你写的html自动渲染。这个自动渲染是不包含居中与对齐设置的,所以要自己写text-align。其它的都和用markdown写的表格渲染结果一样。下面的例子中我把表头的文字居中了。

<style>th{text-align:center}</style>
<table>
<thead>
<tr>
<th>A</th><th>B</th><th>C</th>
</tr>
</thead>
<tbody>
<tr>
<td>占位符</td><td colspan="2">合并了两列</td>
</tr>
<tr>
<td rowspan="2" colspan="2">合并了两行两列</td><td>$F(x)=x^2$</td>
</tr>
<tr>
<td><b>加粗</b></td>
</tr>
</tbody>
<table>
ABC
占位符合并了两列
合并了两行两列$F(x)=x^2$
加粗

貌似一切正常?不,刚才说的全是假的。前面写的都是在本博客中的markdown表格的合并单元格,的确很符合标题啊

这只是kramdown的编译结果,我曾经在本博客手动添加了MathJax支持,所以公式可以正常显示。如果把刚才的代码原样复制到Typora之中,会发现公式不能显示,这对于我来说意味着完全废了。

Real solution?

如何才能显示公式呢?我在Github上搜了一圈,搜到了这个Issue,然而它还并没有被解决。

连Github上的Typora官方团队都帮不了我了,怎么办?那就只能求助于万能的知乎了!(其实是从Google上搜到的)

我按照这个回答的方法,先用markdown写一个没有合并的表格,然后导出成html,只复制里面关于此表格的那一段(<table></table>之间的),先删掉所有的空格子(<td>&nbsp;</td>),然后在合并单元格的左上角<td>中添加上rowspancolspan属性,把成果粘贴到typora里,问题就解决了。

可惜在Typora中正常工作的这一段html直接搬到这个网站上面是不能正常显示的(会显示两次,因为原文有一次MathJax的渲染,还有一个Typora已经渲染好了的矢量图),所以就没有演示了。只有一张截图作为这两种方法的对比:

然后你欣喜若狂,导出成PDF,完成!打开PDF一看,怎么公式的地方还是空空如也?

Full solution!

既然这个表格是直接从html里面复制的,那么在html里肯定是正常的。所以先导出成html,然后在Chrome里面打印就可以了。什么强制分页之类的支持是正常的。