最基础的表格语法

一个 Markdown 表格由三部分组成:表头行、分隔行、数据行。用竖线 | 分列,分隔行用三个及以上的连字符 -

| 姓名 | 年龄 | 城市 |
| --- | --- | --- |
| 小明 | 28 | 上海 |
| 小红 | 31 | 北京 |

渲染出来就是一张普通表格。竖线前后空格只是为了好看,不写也行,但写了更易读、改起来不容易出错。

小提示:分隔行里每列至少 3 个 -(如 ---),前后可以加 : 来指定对齐方式,这就是下面要讲的重点。

表头对齐:左 / 中 / 右(重点)

很多人写表格时发现:明明想把「金额」那一列右对齐,渲染出来却全是左对齐。原因就是分隔行没有加冒号。对齐方式由分隔行里的冒号位置决定:

  • :--- —— 左对齐(冒号在左)
  • :---: —— 居中(左右都有冒号)
  • ---: —— 右对齐(冒号在右)
  • --- —— 不写冒号,默认左对齐

一个完整的例子,四列分别用四种对齐:

| 商品 | 单价 | 数量 | 小计 |
| :--- | :---: | ---: | ---: |
| 笔记本 | 12.5 | 3 | 37.5 |
| 订书机 | 28 | 1 | 28 |

注意:对齐方式是按列生效的,表头和该列所有单元格都会一起对齐。所以「单价」列写了 :---:,表头「单价」和下面的数字都会居中。

为什么我的对齐没生效?冒号必须是半角英文冒号 :,不能是中文全角「:」;连字符也必须是半角 -。从别的文档复制粘贴过来时最容易踩这个坑。mdview 在 v1.0.104 专门修过这个对齐语法不生效的问题,遇到对齐失效,先检查是不是全角符号。

实际该用哪种对齐

一个实用的对齐约定,能让表格一眼看清:

  • 文字列(姓名、商品名、说明):左对齐 :---,阅读最自然;
  • 数字列(金额、数量、百分比):右对齐 ---:,小数位上下对齐,方便比较大小;
  • 状态 / 标签列(是/否、状态):居中 :---:,视觉上更整齐。

尤其是数字列右对齐——这是 Excel、财务报表的惯例,照着做准没错。

列宽与单元格换行

Markdown 表格不能直接指定列宽,列宽由内容和渲染器自动决定。源码里把某一列的 - 写很长(比如 ----------)不会让那列变宽,它只影响源码的观感。

如果某个单元格里文字太长,想要手动换行,可以写 HTML 的 <br> 标签:

| 地址 |
| --- |
| 上海市<br>浦东新区<br>张江高科 |

大多数 Markdown 渲染器(包括 mdview)都支持在单元格里写这类行内 HTML。

单元格里也能写富文本

表格单元格里可以正常使用行内格式——加粗、行内代码、链接都行:

| 字段 | 类型 | 说明 |
| --- | --- | --- |
| **id** | `number` | 主键,[详见设计文档](#) |
| name | `string` | 用户名 |

需要注意:单元格里不能直接换行(一个回车会破坏表格结构),要换行就用上面的 <br>;也不能直接写整段段落或多级列表,太复杂的内容建议拆成普通段落或改用 HTML 表格。

合并单元格怎么办(HTML 兜底)

这是 Markdown 表格最大的短板:原生语法不支持合并单元格(没有 colspan / rowspan)。如果你必须做跨列、跨行合并,直接写 HTML 表格:

<table>
  <tr><th>类别</th><th>项目</th></tr>
  <tr><td rowspan="2">水果</td><td>苹果</td></tr>
  <tr><td>香蕉</td></tr>
</table>

HTML 表格能和 Markdown 混排,mdview 也能正常渲染。代价是源码没那么好读,所以建议:能用 Markdown 表格就别上 HTML,只有遇到合并单元格这类需求时才兜底。

表格太宽怎么办

列太多、内容太长时,表格会撑得很宽。几个实用办法:

  • 精简列:把不重要的列删掉,或者拆成两张表;
  • 缩短内容:长说明改用链接或脚注,单元格里只留关键词;
  • 横向滚动:mdview 渲染的宽表格会自动出现横向滚动条,不会把页面撑爆,电脑上拖动查看即可。

在 mdview 里快速插入表格

如果用 mdview 阅读时想顺手改两笔,按 F3 进入内置编辑器,有几种快速建表的方式:

  • 输入 table 再按 Tab,自动展开成一个 2×2 的表格模板,光标停在第一个标题等你填;
  • Ctrl + T,效果同上,直接插入表格片段。

展开后的模板已经带好了分隔行,改改文字和冒号就能调对齐。更多编辑器快捷键见这篇速查

速查小结

想要的效果分隔行写法
左对齐(默认):------
居中:---:
右对齐---:
单元格内换行<br>
合并单元格改用 HTML <table>

记住一句话:对齐看分隔行的冒号,数字右对齐、文字左对齐,你的表格就会立刻专业很多。