markdown中编辑复杂表格

markdown中编辑复杂表格

使用markdown自带语法

markdown中自带了基本的表格编辑语法:

如:

| name  | age | gender    | money  |
|-------|:---:|-----------|-------:|
| rhio  | 384 | robot     | $3,000 |
| haroo | .3  | bird      | $430   |
| jedi  | ?   | undefined | $0     |

将显示为:

nameagegendermoney
rhio384robot$3,000
haroo.3bird$430
jedi?undefined$0

markdown没有提供复杂表格的创建语句,比如合并单元格。但我们可以使用其他方式来实现。

利用excel编辑表格

markdown支持html语法,所以我们可以先使用excel生成我们需要的表格,然后将其转化为html格式放入markdown中:

使用excel创建一个表格

在excel中创建一个示例:

这里写图片描述

此表格包含单元格的合并,如单纯使用markdown语法无法实现。

将excel表格导出为html格式

选定表格,单击另存为,选择导出格式为html,此时可选择所需表格区间

这里写图片描述

保存后打开生成的html文件,将其中vim<table></table> 间的数据复制到markdown中:

<table border=0 cellpadding=0 cellspacing=0 width=207 style='border-collapse:
 collapse;table-layout:fixed;width:156pt'>
 <col width=69 span=3 style='width:52pt'>
 <tr height=19 style='height:14.0pt'>
  <td colspan=2 height=19 class=xl636101 width=138 style='height:14.0pt;
  width:104pt'>合并行</td>
  <td class=xl156101 width=69 style='width:52pt'>c1</td>
 </tr>
 <tr height=19 style='height:14.0pt'>
  <td height=19 class=xl156101 style='height:14.0pt'>a2</td>
  <td rowspan=2 class=xl636101>合并列</td>
  <td class=xl156101>c2</td>
 </tr>
 <tr height=19 style='height:14.0pt'>
  <td height=19 class=xl156101 style='height:14.0pt'>a3</td>
  <td class=xl156101>c3</td>
 </tr>
 <tr height=19 style='height:14.0pt'>
  <td height=19 class=xl156101 style='height:14.0pt'>a4</td>
  <td colspan=2 rowspan=2 class=xl636101>大合并</td>
 </tr>
 <tr height=19 style='height:14.0pt'>
  <td height=19 class=xl156101 style='height:14.0pt'>a5</td>
 </tr>
 <![if supportMisalignedColumns]>
 <tr height=0 style='display:none'>
  <td width=69 style='width:52pt'></td>
  <td width=69 style='width:52pt'></td>
  <td width=69 style='width:52pt'></td>
 </tr>
 <![endif]>
</table>

在markdown中展示如下图:

这里写图片描述

生成的脚本中使用colspan和rowspan实现了表格合并。

如此,便将复杂的表格写入了markdown中。

出现的问题

在完成此实验时出现一个现象,在markdown中生成的表格上方无端多出很多空行:

这里写图片描述

这是由于导入的html中自带的回车符导致的,将回车符全删除即可。但如此以来又导致生成的markdown脚本几乎无法编辑。所以使用时要三思。

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 像素格子 设计师:CSDN官方博客 返回首页