Skip to content

Markdown 详细语法指南

前言

Markdown 是一种轻量级标记语言,由 John Gruber 于 2004 年创建。它允许使用简单的文本语法来编写结构化文档,最终转换为 HTML 格式显示。由于其简洁易用的特性,Markdown 已成为技术文档、博客写作、README 文件的标准格式,广泛应用于 GitHub、掘金、CSDN、知乎等平台。

本文将详细介绍 Markdown 的完整语法体系,涵盖基础语法、扩展语法、最佳实践等内容,帮助读者全面掌握 Markdown 编写技巧。


一、基础语法

1.1 标题

Markdown 支持六级标题,使用 # 符号表示,# 数量对应标题级别。

markdown
# 一级标题 (H1)

## 二级标题 (H2)

### 三级标题 (H3)

#### 四级标题 (H4)

##### 五级标题 (H5)

###### 六级标题 (H6)

渲染效果:

一级标题 (H1)

二级标题 (H2)

三级标题 (H3)

四级标题 (H4)

五级标题 (H5)
六级标题 (H6)

注意事项:

  • # 与标题文本之间必须有空格
  • 建议一篇文档只有一个 H1 标题
  • 标题后不应紧跟空行(部分渲染器要求空行)

1.2 段落与换行

Markdown 中的段落由空行分隔,换行需要在行尾添加两个空格。

markdown
这是第一段。

这是第二段。

这是一行  
这是同一行的下一部分(行尾有两个空格)

渲染效果:

这是第一段。

这是第二段。

这是一行
这是同一行的下一部分(行尾有两个空格)


1.3 强调

Markdown 提供两种强调方式:斜体和粗体。

markdown
_斜体文本__斜体文本_

**粗体文本****粗体文本**

**_粗斜体文本_****_粗斜体文本_**

渲染效果:

斜体文本斜体文本

粗体文本粗体文本

粗斜体文本粗斜体文本


1.4 删除线

使用 ~~ 包裹文本表示删除线。

markdown
~~删除的文本~~

渲染效果:

删除的文本


1.5 引用

使用 > 符号表示引用,支持嵌套引用。

markdown
> 这是一级引用
>
> > 这是二级引用
> >
> > > 这是三级引用

> 引用段落可以包含多个
> 连续的行

渲染效果:

这是一级引用

这是二级引用

这是三级引用

引用段落可以包含多个 连续的行


1.6 列表

无序列表

使用 -*+ 表示无序列表项。

markdown
- 列表项一
- 列表项二
- 列表项三

* 列表项一
* 列表项二
* 列表项三

- 列表项一
- 列表项二
- 列表项三

渲染效果:

  • 列表项一
  • 列表项二
  • 列表项三

有序列表

使用数字加 . 表示有序列表项。

markdown
1. 第一步
2. 第二步
3. 第三步

渲染效果:

  1. 第一步
  2. 第二步
  3. 第三步

嵌套列表

列表项可以嵌套,嵌套时缩进两个空格。

markdown
1. 外层列表项一
   - 内层无序列表项
   - 内层无序列表项
2. 外层列表项二
   1. 内层有序列表项
   2. 内层有序列表项

渲染效果:

  1. 外层列表项一
    • 内层无序列表项
    • 内层无序列表项
  2. 外层列表项二
    1. 内层有序列表项
    2. 内层有序列表项

1.7 代码

行内代码

使用反引号 ` 包裹行内代码。

markdown
使用 `console.log()` 输出日志。

变量 `name` 的类型是 `string`

渲染效果:

使用 console.log() 输出日志。

变量 name 的类型是 string

代码块

使用三个反引号 ``` 包裹代码块,可指定语言高亮。

markdown
```javascript
function hello(name) {
  console.log(`Hello, ${name}!`);
}
```
python
def hello(name):
    print(f"Hello, {name}!")
bash
npm install vue

**渲染效果:**

```javascript
function hello(name) {
  console.log(`Hello, ${name}!`);
}
python
def hello(name):
    print(f"Hello, {name}!")
bash
npm install vue

1.8 链接

基础链接

markdown
[链接文本](URL地址)

[访问 GitHub](https://github.com)

渲染效果:

链接文本

访问 GitHub

带标题的链接

markdown
[链接文本](URL地址 "链接标题")

[访问 GitHub](https://github.com "GitHub 官方网站")

渲染效果:

访问 GitHub

引用链接

markdown
[访问 GitHub][github]
[访问 VitePress][vitepress]

[github]: https://github.com
[vitepress]: https://vitepress.dev

渲染效果:

访问 GitHub访问 VitePress

自动链接

markdown
<https://github.com>
<email@example.com>

渲染效果:

https://github.comemail@example.com


1.9 图片

基础图片

markdown
![图片替代文本](图片URL)

![示例图片](https://picsum.photos/400/200)

渲染效果:

示例图片

带标题的图片

markdown
![图片替代文本](图片URL "图片标题")

![示例图片](https://picsum.photos/400/200 "这是一张示例图片")

引用图片

markdown
![示例图片][example-img]

[example-img]: https://picsum.photos/400/200

图片作为链接

markdown
[![示例图片](https://picsum.photos/200/100)](https://picsum.photos)

渲染效果:

示例图片


1.10 分割线

使用 ---***___ 表示分割线,需要单独占一行。

markdown
---
---

---

渲染效果:





二、扩展语法

2.1 表格

Markdown 支持简单的表格语法。

markdown
| 姓名 | 年龄 | 职业     |
| ---- | ---- | -------- |
| 张三 | 25   | 工程师   |
| 李四 | 30   | 设计师   |
| 王五 | 28   | 产品经理 |

渲染效果:

姓名年龄职业
张三25工程师
李四30设计师
王五28产品经理

对齐方式

markdown
| 左对齐 | 居中对齐 |             右对齐 |
| :----- | :------: | -----------------: |
| 内容一 |  内容二  |             内容三 |
| 短     | 中等长度 | 这是一个很长的内容 |

渲染效果:

左对齐居中对齐右对齐
内容一内容二内容三
中等长度这是一个很长的内容

2.2 任务列表

使用 - [ ]- [x] 表示待办和已完成任务。

markdown
- [x] 完成项目文档
- [x] 编写单元测试
- [ ] 优化代码性能
- [ ] 部署到生产环境

渲染效果:


2.3 脚注

使用 [^标记] 定义脚注,在文档末尾添加脚注内容。

markdown
这是带有脚注的文本[^1]。

[^1]: 这是脚注的具体内容。

渲染效果:

这是带有脚注的文本


2.4 定义列表

部分 Markdown 渲染器支持定义列表。

markdown
术语一
: 术语一的定义说明

术语二
: 术语二的第一个定义
: 术语二的第二个定义

渲染效果:

术语一 : 术语一的定义说明

术语二 : 术语二的第一个定义 : 术语二的第二个定义


2.5 数学公式

使用 $$ 包裹 LaTeX 数学公式。

markdown
$$
E = mc^2
$$

$$
\sum_{i=1}^{n} i = \frac{n(n+1)}{2}
$$

渲染效果:

$$ E = mc^2 $$

$$ \sum_{i=1}^{n} i = \frac{n(n+1)}{2} $$


2.6 目录

使用 [[toc]] 或特定语法生成目录(取决于渲染器)。

markdown
[[toc]]

2.7 代码高亮

在代码块中指定语言,支持多种编程语言。

markdown
```html
<div class="container">
  <p>Hello World</p>
</div>
```
css
.container {
  display: flex;
  justify-content: center;
}
json
{
  "name": "markdown",
  "version": "1.0.0"
}

**渲染效果:**

```html
<div class="container">
  <p>Hello World</p>
</div>
css
.container {
  display: flex;
  justify-content: center;
}
json
{
  "name": "markdown",
  "version": "1.0.0"
}

三、Frontmatter

Frontmatter 是位于文档顶部的元数据区域,使用 --- 包裹。

markdown
---
title: Markdown 详细语法指南
date: 2026-07-02
tags: [Markdown, 语法, 教程]
categories: [前端]
author: 作者名称
description: 文章描述信息
---

常见字段:

字段说明示例
title文章标题Markdown 详细语法指南
date发布日期2026-07-02
tags标签数组[Markdown, 语法, 教程]
categories分类数组[前端]
author作者名称作者名称
description文章描述文章描述信息
draft是否草稿truefalse
hidden是否隐藏truefalse

四、转义字符

使用反斜杠 \ 转义特殊字符。

markdown
\*斜体文本\* 不会被渲染为斜体

\\ 显示反斜杠

\[链接文本](URL) 显示为普通文本

\# 标题

渲染效果:

*斜体文本* 不会被渲染为斜体

\ 显示反斜杠

[链接文本](URL) 显示为普通文本

# 标题

需要转义的字符:

markdown
\ 反斜杠
` 反引号

- 星号
  \_ 下划线
  {} 花括号
  [] 方括号
  () 圆括号

# 井号

- 加号

* 减号
  . 点号
  ! 感叹号

五、常见踩坑点

5.1 标题与内容之间缺少空行

markdown
## 标题

内容

问题: 部分渲染器可能无法正确识别标题。

解决方案: 在标题和内容之间添加空行。

markdown
## 标题

内容

5.2 列表项换行问题

markdown
- 列表项一
  继续列表项一

问题: 第二行可能被解析为新段落。

解决方案: 行尾添加两个空格或使用缩进。

markdown
- 列表项一  
  继续列表项一

- 列表项一
  继续列表项一

5.3 代码块语言标识错误

markdown
```javascript
print("Hello");
```

**问题:** 使用了 JavaScript 语法高亮但代码是 Python。

**解决方案:** 使用正确的语言标识。

```markdown
```python
print("Hello")

### 5.4 链接中包含特殊字符

```markdown
[链接](https://example.com?a=1&b=2)

问题: & 字符可能导致渲染错误。

解决方案: 使用 HTML 实体编码。

markdown
[链接](https://example.com?a=1&b=2)

5.5 表格对齐错误

markdown
| 左对齐 | 右对齐 |
| :----- | -----: |
| 内容   |   内容 |

问题: 分隔行格式错误。

解决方案: 每个单元格都需要分隔符。

markdown
| 左对齐 | 右对齐 |
| :----- | -----: |
| 内容   |   内容 |

六、最佳实践

6.1 文档结构规范

  1. 文档顶部使用 Frontmatter 定义元数据
  2. 使用 H1 作为文档主标题(建议仅使用一个)
  3. 使用 H2-H6 组织内容层级
  4. 段落之间使用空行分隔
  5. 列表和引用前后添加空行

6.2 代码块规范

  1. 始终指定代码块的语言标识
  2. 代码保持适当缩进
  3. 代码注释清晰简洁
  4. 长代码行适当换行

6.3 链接规范

  1. 链接文本清晰描述目标内容
  2. 外部链接使用完整 URL
  3. 内部链接使用相对路径
  4. 定期检查链接有效性

6.4 图片规范

  1. 提供有意义的替代文本
  2. 控制图片尺寸
  3. 使用合适的图片格式
  4. 本地图片使用相对路径

6.5 版本兼容性

不同平台的 Markdown 渲染器可能存在差异,注意以下兼容性问题:

语法GitHubVitePressCSDN掘金
表格
任务列表
脚注
数学公式
定义列表

七、常用工具推荐

7.1 编辑器

  • VS Code:支持 Markdown 预览和丰富插件
  • Typora:所见即所得的 Markdown 编辑器
  • Obsidian:知识管理与 Markdown 写作工具
  • Notion:集成 Markdown 支持的协作平台

7.2 在线工具

  • Dillinger:在线 Markdown 编辑器
  • StackEdit:支持云端同步的在线编辑器
  • Markdown Live Preview:实时预览工具

7.3 转换工具

  • Pandoc:强大的文档格式转换工具
  • Markdown to PDF:在线转换工具
  • vitepress:将 Markdown 转换为静态网站

八、全文总结

本文详细介绍了 Markdown 的完整语法体系,包括:

  1. 基础语法:标题、段落、强调、删除线、引用、列表、代码、链接、图片、分割线
  2. 扩展语法:表格、任务列表、脚注、定义列表、数学公式、目录、代码高亮
  3. Frontmatter:文档元数据配置
  4. 转义字符:特殊字符处理
  5. 踩坑点:常见问题及解决方案
  6. 最佳实践:文档规范和版本兼容性
  7. 工具推荐:编辑器和转换工具

Markdown 的核心优势在于简洁高效,掌握这些语法后,可以快速编写结构清晰、格式美观的技术文档。建议根据目标平台的渲染特性选择合适的语法,确保文档在不同环境下都能正确显示。


参考资源: