Markdown 表格语法
在 Markdown 中,表格用于展示结构化的数据。Markdown 提供了一种简单的方式来创建表格,虽然它的功能可能不如文字处理软件(如 Word)强大,但对于基本的表格展示已经完全足够了。
Markdown 的表格由行和列组成,我们可以使用中划线(-)创建分隔行,然后使用竖线(|)分隔单元格。
语法:
| 列1标题 | 列2标题 | 列3标题 |
| --- | --- | --- |
| 单元格1 | 单元格2 | 单元格3 |
| 单元格4 | 单元格5 | 单元格6 |说明:
第 1 行定义表格的列标题,列标题与列标题之间使用 “|” 分隔。
第 2 行是分隔行,用于分隔标题行和数据行。分隔行中的连字符数量不影响表格的显示,但为了美观和规范,通常会与对应列的标题长度对齐。
从第 3 行开始,每一行代表表格中的一行数据。单元格与单元格之间也是使用 “|” 分隔。
此外,我们还可以在分隔行中使用冒号(:),可以指定列的对齐方式:
:---:左对齐(默认)。:---::居中对齐。---::右对齐。
虽然 Markdown 并不强制横线数量(只要 >=3 即可),但为了保持视觉上的统一,最标准的写法是使用 “3 个横线”。
注意:
- 表格的每一行应包含相同数量的单元格,即使某个单元格为空,也需要使用一个 “|” 来占位。
- 不同 Markdown 编辑器 对表格的渲染效果会有一定差异。
Markdown 表格示例
接下来,我们通过几个简单的例子来介绍一下 Markdown 是如何定义表格的。
示例 1:Markdown 实现基本表格
| 学号 | 姓名 | 成绩 |
| --- | --- | --- |
| 张三 | 18 | 100 |
| 李四 | 17 | 95 |
| 王五 | 19 | 80 |渲染效果如下图所示。

生成 HTML 代码如下。
<table>
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>成绩</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>18</td>
<td>100</td>
</tr>
<tr>
<td>李四</td>
<td>17</td>
<td>95</td>
</tr>
<tr>
<td>王五</td>
<td>19</td>
<td>80</td>
</tr>
</tbody>
</table>分析:
从结果可以看出,Markdown 中的表格本质上最终会转换为 HTML 中的 table 标签。
示例 2:带有对齐方式的表格
| 学号 | 姓名 | 成绩 |
| :--- | :---: | ---: |
| 张三 | 18 | 100 |
| 李四 | 17 | 95 |
| 王五 | 19 | 80 |渲染效果如下图所示。

生成 HTML 代码如下。
<table>
<thead>
<tr>
<th style="text-align:left">学号</th>
<th style="text-align:center">姓名</th>
<th style="text-align:right">成绩</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">张三</td>
<td style="text-align:center">18</td>
<td style="text-align:right">100</td>
</tr>
<tr>
<td style="text-align:left">李四</td>
<td style="text-align:center">17</td>
<td style="text-align:right">95</td>
</tr>
<tr>
<td style="text-align:left">王五</td>
<td style="text-align:center">19</td>
<td style="text-align:right">80</td>
</tr>
</tbody>
</table>分析:
如果你的应用是一个 Web 应用,我们并不推荐使用在 Markdown 中指定列的对齐方式,因为这种方式是直接在标签内部使用行内样式进行设置,会导致代码冗余并降低代码可读性。
实际上,对于表格样式的控制,我们更推荐直接使用 CSS 来控制具体样式。对 CSS 有兴趣的小伙伴,可以查看:CSS 教程。
