第 7 章:表格
表格是展示结构化数据最直观的方式。Markdown 用简洁的管道符和短横线绘制表格,让数据一目了然。
学习目标
- 掌握基本表格的创建语法
- 理解单元格对齐(左对齐、居中、右对齐)
- 学会在表格中使用粗体、代码、链接等格式
- 了解表格的局限性和替代方案
7.1 基本表格
Markdown 表格使用管道符 | 和短横线 - 构建:
markdown
| 姓名 | 年龄 | 城市 |
|------|------|------|
| 张三 | 28 | 北京 |
| 李四 | 32 | 上海 |
| 王五 | 25 | 深圳 |渲染:
姓名 年龄 城市 张三 28 北京 李四 32 上海 王五 25 深圳
语法拆解
| 部分 | 说明 |
|---|---|
| 表头行 | 第一行,用 ` |
| 分隔行 | 第二行,每列至少三个 -,分隔表头和数据 |
| 数据行 | 后续行,每行对应一条记录 |
源码可读性技巧
管道符对齐能让源码也更易读(但不影响渲染):
markdown
| 功能 | 状态 | 负责人 |
|-----------|----------|--------|
| 用户登录 | ✅ 完成 | 张三 |
| 数据导出 | 🔄 进行中 | 李四 |
| 报表模块 | ⏳ 待开始 | 王五 |7.2 单元格对齐
在分隔行中使用冒号 : 控制对齐方式:
markdown
| 左对齐(默认) | 居中对齐 | 右对齐 |
|:-----------|:------:|------:|
| 文字 | 文字 | 数值 |
| 较长的文字 | 文字 | 100 |
| 短 | 文字 | 10000 |渲染:
左对齐(默认) 居中对齐 右对齐 文字 文字 数值 较长的文字 文字 100 短 文字 10000
对齐规则一览
| 分隔行写法 | 对齐方式 | 推荐用途 |
|---|---|---|
| ` | ---` | 左对齐(默认) |
| ` | :---` | 左对齐(显式) |
| ` | :---:` | 居中 |
| ` | ---:` | 右对齐 |
| ` | :---: | ` |
7.3 表格内使用格式
表格单元格内可以使用大部分 Markdown 格式:
markdown
| 项目 | 状态 | 链接 |
|------|------|------|
| `user-api` | **已完成** | [仓库](https://github.com) |
| `pay-api` | *进行中* | [文档](https://docs.example.com) |
| `log-api` | ~~已废弃~~ | — |渲染:
项目 状态 链接 user-api已完成 仓库 pay-api进行中 文档 log-api已废弃—
表格内可以使用的元素
| 元素 | 是否支持 | 备注 |
|---|---|---|
| 粗体/斜体 | ✅ | — |
| 行内代码 | ✅ | — |
| 链接 | ✅ | — |
| 图片 | ✅ | 小图标可以,大图片会破坏表格 |
| 列表 | ❌ | 不支持在单元格内创建多行列表 |
| 代码块 | ❌ | 不支持跨行 |
| 多段落 | ❌ | 不支持单元格内换行(可用 <br> 替代) |
7.4 表格内换行
如果需要在单元格内换行(如展示多行地址),用 <br> 标签:
markdown
| 名称 | 地址 |
|------|------|
| 北京总部 | 北京市海淀区<br>中关村大街 1 号 |
| 上海分部 | 上海市浦东新区<br>陆家嘴金融中心 |7.5 表格的局限性
Markdown 表格适合简单、少量数据的展示。遇到以下情况,应该考虑替代方案:
| 限制 | 说明 | 替代方案 |
|---|---|---|
| 不支持单元格合并 | 没有 colspan/rowspan | 用 HTML <table> |
| 不支持复杂嵌套 | 单元格内不能放多行内容 | 用 HTML 或分拆表格 |
| 大数据量 | Markdown 源码会很长 | 用 HTML 或外部数据可视化 |
| 不支持列宽控制 | 宽度由内容决定 | 用 HTML <table> 或图片 |
HTML 表格作为替代
当 Markdown 表格不够用,可以无缝切换到 HTML:
html
<table>
<thead>
<tr>
<th colspan="2">合并了两列的表头</th>
</tr>
</thead>
<tbody>
<tr>
<td>列 A</td>
<td>列 B</td>
</tr>
</tbody>
</table>7.6 表格的实践建议
- 管道符对齐:对表格源码做对齐排版,方便编辑和版本对比
- 表头明确:每列都应该有清晰的表头
- 适度使用:数据超过 10 行考虑其他呈现方式
- 保持简洁:单元格内避免嵌套复杂格式
- 统一对齐:文本左对齐、数字右对齐——符合阅读习惯
7.7 语法速查
| 语法 | 写法 | 说明 |
|---|---|---|
| 基本表格 | ` | 列1 |
| 左对齐 | ` | :---` 或默认 |
| 居中 | ` | :---: |
| 右对齐 | ` | ---: |
| 单元格换行 | <br> | HTML 标签 |
| 空单元格 | ` | ` 之间留空 |
本章小结
| 要点 | 说明 |
|---|---|
| 基本结构 | 表头行 + 分隔行 + 数据行 |
| 对齐方式 | 冒号 : 在分隔行控制(左/中/右) |
| 单元格内格式 | 支持粗体、代码、链接等基础格式 |
| 局限性 | 不支持合并单元格、列宽控制、复杂嵌套 |
| 替代方案 | 复杂场景使用 HTML <table> |
下一章预告
表格让数据结构化。但如果你需要在 Markdown 中输入
*、#、|这些特殊字符本身怎么办?下一章学习转义与特殊字符。