---
title: Markdown 的正确使用方式
---

[Markdown](https://www.markdownguide.org/basic-syntax/) 可以将你在 Dify 应用中的输出从纯文本转化为格式良好、专业美观的响应内容。在 Answer 和 End 节点中使用 Markdown，可以渲染标题、列表、代码块、表格等元素，为终端用户创造清晰的视觉层次结构。

## Dify 中的基本 Markdown 语法

你可以在 Answer / End 节点中使用 Markdown 渲染以下内容：

* 标题
* 加粗、斜体、删除线
* 列表
* 表格
* 多行代码块
* 音频和视频

<img
  src="/images/CleanShot2025-07-14at00.34.54.png"
  className="mr-auto"
/>

### 标题

使用 `#` 来表示标题，`#` 的数量表示标题级别：

```markdown
# 一级标题
## 二级标题
### 三级标题
```

### 加粗、斜体、删除线

你可以使用以下方式设置文本样式：

```markdown
**加粗文本**
*斜体文本*
~~删除线文本~~
```

### 列表

可以创建有序和无序列表：

```markdown
- 无序列表项 1
- 无序列表项 2
  - 嵌套无序项
1. 有序列表项 1
2. 有序列表项 2
   1. 嵌套有序项
```

### 表格

使用竖线和短横线创建表格：

```markdown
| 表头 1 | 表头 2 |
|--------|--------|
| 第 1 行第 1 列 | 第 1 行第 2 列 |
| 第 2 行第 1 列 | 第 2 行第 2 列 |
```

### 多行代码块

使用三个反引号 <code>\`\`\`python</code> 创建多行代码块：

```python
def hello_world():
    print("Hello, World!")
```

### 音频和视频

可以通过以下语法插入音频和视频：

```markdown
<video controls>
  <source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerBlazes.mp4" type="video/mp4">
</video>
<audio controls>
  <source src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3" type="audio/mpeg">
</audio>
```
<Note>
  如果你希望了解更多关于 Markdown 的使用方式，可以参考 [Markdown Guide](https://www.markdownguide.org/basic-syntax/)。
</Note>

## Dify 中的高级 Markdown 功能

### 按钮和链接

你可能不喜欢默认由大模型生成的后续问题，此时你可以使用按钮和链接，引导对话朝特定方向发展。

<img
src="/images/screenshot-20250714-134035.png"
className="mr-auto"
/>

你可以使用以下语法创建按钮和链接：

```
<button data-message="Hello Dify" data-variant="primary">Hello Dify</button>
<button data-message="Hello Dify" data-variant="danger">Hello Dify</button>
```

按钮需要定义两个属性：

* `data-variant`：按钮样式，可选值包括 `primary`、`secondary`、`warning`、`secondary-accent`、`ghost`、`ghost-accent`、`tertiary`
* `data-message`：点击按钮时发送的消息内容

链接的用法更为简单：

```
<a href="https://dify.ai" target="_blank">Dify</a>
```

你也可以使用 `abbr` 语法创建交互链接，用于对话中触发特定交互：

```
[特殊链接](abbr:special-link)
```

---

### 表单（Form）

表单需要设置 `data-format` 属性，支持 `json` 和 `text` 两种格式，默认是 `text`。当设置为 `data-format="json"` 时，表单会以 JSON 对象提交。

<img
src="/images/screenshot-20250714-134150.png"
className="mr-auto"
/>

#### 支持的输入类型

Dify 支持多种表单输入类型：

* text（文本）
* textarea（多行文本）
* password（密码）
* time（时间）
* date（日期）
* datetime（日期时间）
* select（下拉选择）
* checkbox（复选框）
* hidden（隐藏字段）

如果你想在对话中渲染一个表单，可以使用如下语法：

```
<form data-format="json"> // 默认为 text
  <label for="username">用户名：</label>
  <input type="text" name="username" />
  <label for="hidden_input">隐藏字段：</label>
  <input type="hidden" name="hidden_input" value="hidden_value" />
  <label for="password">密码：</label>
  <input type="password" name="password" />
  <label for="content">内容：</label>
  <textarea name="content"></textarea>
  <label for="date">日期：</label>
  <input type="date" name="date" />
  <label for="time">时间：</label>
  <input type="time" name="time" />
  <label for="datetime">日期时间：</label>
  <input type="datetime" name="datetime" />
  <label for="select">选择：</label>
  <input type="select" name="select" data-options='["hello","world"]'/>
  <input type="checkbox" name="check" data-tip="勾选表示你已同意"/>
  <button data-variant="primary">登录</button>
</form>
```

<Note>
  Hidden 隐藏字段不会显示给用户，可以用来在不经用户输入的情况下传递数据。
</Note>

---

### 图表（Chart）

你可以在 Markdown 中使用 [echarts](https://dify.ai/docs/guides/tools/chart) 渲染图表。语法如下：

<img
src="/images/screenshot-20250714-134238.png"
className="mr-auto"
/>

<Note>
  要渲染图表，使用以 <code>\`\`\`echarts</code> 开头的代码块，并将配置写入其中。
</Note>

```echarts
{
  "title": {
    "text": "ECharts 入门示例"
  },
  "tooltip": {},
  "legend": {
    "data": ["销量"]
  },
  "xAxis": {
    "data": ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
  },
  "yAxis": {},
  "series": [{
    "name": "销量",
    "type": "bar",
    "data": [5, 20, 36, 10, 10, 20]
  }]
}
```

---

### 音乐（乐谱）

除了图表，你还可以在 Markdown 中渲染乐谱。我们支持 [ABC notation](https://paulrosen.github.io/abcjs/) 乐谱标准，使用以下语法：

<img
src="/images/screenshot-20250714-134431.png"
className="mr-auto"
/>

<Note>
  要渲染乐谱，使用以 <code>\`\`\`abc</code> 开头的代码块，并将 ABC 记谱内容写入其中。
</Note>

```abc
X: 1
T: Cooley's
M: 4/4
L: 1/8
K: Emin
|:D2|EB{c}BA B2 EB|~B2 AB dBAG|FDAD BDAD|FDAD dAFD|
EBBA B2 EB|B2 AB defg|afe^c dBAF|DEFD E2:|
|:gf|eB B2 efge|eB B2 gedB|A2 FA DAFA|A2 FA defg|
eB B2 eBgB|eB B2 defg|afe^c dBAF|DEFD E2:|
```

---

## 最佳实践

如果你希望提前定义 Markdown 内容，可以使用 Dify 的 [模板功能](/en/guides/workflow/node/template)。这可以让你在后续节点中复用模板内容，提高效率与一致性。

{/*
Contributing Section
DO NOT edit this section!
It will be automatically generated by the script.
*/}

---

[编辑此页面](https://github.com/langgenius/dify-docs/edit/main/zh-hans/workshop/basic/the-right-way-of-markdown.mdx) | [提交问题](https://github.com/langgenius/dify-docs/issues/new?template=docs.yml)

