Markdown 代码块生成器

选择代码块类型和语言,粘贴代码,即可复制带语法高亮的 Markdown 代码块。全部计算都在你的浏览器本地完成。

免费 · 无需注册 · 全程在浏览器内运行最后更新

Markdown 中怎么写代码块?

在代码上下各单独一行写三个反引号,并在起始反引号后紧跟语言名称——语法高亮正是由这个语言标识符触发的。如果只是句子中的一小段代码,改用单个反引号即可。每行缩进四个空格同样能生成代码块,但无法指定语言。

markdown
```python
print("Hello, Markdown!")
```

渲染为带 Python 高亮的围栏代码块,对应的 HTML 是 <pre><code class="language-python">。

在线使用 Markdown 代码块生成器

参数设置

输出结果

Markdown 代码块语法详解

Markdown 展示代码有三种写法:围栏代码块、缩进代码块和行内代码。围栏写法是如今的首选,因为只有它能带语言标识符。

带语言的围栏代码块

三个反引号开始、三个反引号结束,语言名称紧跟在起始反引号后面,中间不留空格。GitHub、GitLab、Obsidian、Discord 以及各类静态站点生成器都认这种写法。

markdown
```javascript
export function slugify(title) {
  return title.toLowerCase().replace(/\s+/g, "-");
}
```

渲染为带 JavaScript 高亮的代码块。省略语言标识符时,同样的代码只会显示为无高亮的纯文本。

常用语言标识符列表

标识符就是高亮器认识的一个短名称。下面是最常用的一批;GitHub 通过 Linguist 支持 200 多种,还接受 js、ts、py、sh、yml、cs、c++ 这类别名。

markdown
```javascript   ```typescript   ```python   ```java
```c            ```cpp          ```csharp   ```go
```rust         ```swift        ```kotlin   ```php
```ruby         ```bash         ```sql      ```json
```yaml         ```html         ```css      ```diff

不同名称对应不同的语法规则。写错标识符不会报错,渲染器只会退回到无高亮的纯文本。

缩进代码块(四个空格)

每行缩进四个空格或一个制表符,这是围栏语法出现之前的原始写法。它到处都能用,但既不能指定语言,代码本身带缩进时也很容易出错。

markdown
    int main(void) {
        printf("Hello, Markdown!\n");
        return 0;
    }

渲染为无高亮的代码块,每行开头的四个空格会被去掉。

句子中的行内代码

单个反引号用于标记正文中的一小段代码,比如变量名、参数或命令。如果这段内容本身包含反引号,就改用两个反引号作为定界符。

markdown
部署前先执行 `npm run build`。

`` ` `` 这个字符用来开启行内代码。

第一行把 npm run build 显示为等宽字体;第二行原样显示一个反引号,不会提前结束代码段。

用 diff 展示代码变更

diff 标识符按每行的首字符着色:减号表示删除、加号表示新增、空格表示未改动。在 README 或 PR 评论里展示补丁,这是最干净的方式。

markdown
```diff
- const timeout = 1000;
+ const timeout = 5000;
  retry(request, { timeout });
```

GitHub 和 GitLab 会把删除行标红、新增行标绿,未改动的行保持原色。

转义反引号与嵌套围栏

想在代码块里展示另一个代码块,就把外层围栏写得比内层更长:四个反引号可以包住三个,五个可以包住四个,依此类推。

markdown
````markdown
```js
console.log("这段围栏不会被提前闭合");
```
````

内层的三个反引号会原样显示,而不会提前结束外层代码块。

各平台对 Markdown 代码块的支持

围栏代码块几乎处处可用,但各平台支持的语言数量,以及在此之上的扩展能力差别很大。

平台支持情况说明
GitHub / GitLab完全支持通过 Linguist 支持 200 多种语言,支持 diff 着色,可用 <details> 折叠。
Discord完全支持消息中可用 ```语言,语言范围限于 highlight.js 自带的那些。
Slack部分支持``` 能生成代码块,但语言标识符会被忽略,没有语法高亮。
Obsidian完全支持基于 Prism 高亮,部分代码块(如 mermaid)还会直接渲染成图表。
Notion完全支持输入 ``` 自动转成代码块,语言在右上角的下拉框里选择。
Reddit完全支持新版编辑器支持围栏写法;old.reddit.com 仍需使用四空格缩进。
VS Code完全支持Markdown 预览和编辑器内都会高亮显示。

如何在 Markdown 中插入代码块

  1. 选择代码块类型

    多行代码选围栏代码块;面对老旧的 Markdown 解析器选缩进代码块;句子中的短片段选行内代码。

  2. 选择语言

    选中与代码匹配的语言标识符,渲染时才会有语法高亮。日志和终端输出保持纯文本即可。

  3. 填写文件名(可选)

    围栏代码块可以填一个文件名,输出中会带上 title 属性——写教程时用来标明代码片段属于哪个文件。

  4. 粘贴代码并复制

    把代码粘贴进编辑框,在预览标签页确认效果,然后复制 Markdown;如果需要 <pre><code> 标签,切换到 HTML 标签页。

常见问题

Markdown 中怎么创建代码块?

在代码的上一行和下一行各写三个反引号,并在起始反引号后紧跟语言名称(例如 python 或 javascript)来开启语法高亮。每行缩进四个空格同样能生成代码块,但无法指定语言。

怎样给 Markdown 代码块指定语言?

把语言标识符紧跟在起始的三个反引号后面,中间不要留空格,例如 ```python。多数渲染器不区分大小写。缩进代码块没有位置可以放语言标识符,这正是围栏写法更受欢迎的主要原因。

Markdown 代码块支持哪些语言?

取决于渲染器。GitHub 通过 Linguist 识别 200 多种语言。最常用的标识符包括 javascript、typescript、python、java、c、cpp、csharp、go、rust、swift、kotlin、php、ruby、bash、powershell、sql、json、yaml、toml、html、css、xml、markdown 和 diff。js、ts、py、sh、yml、cs 这类别名同样可用。

C 语言代码块的标识符是什么?

C 用 c,C++ 用 cpp,C# 用 csharp。GitHub 也接受 c++ 和 cs 两个别名。由于标识符只是给高亮器的提示,写成一个无法识别的名字并不会报错,代码块只是不带高亮而已。

围栏代码块和缩进代码块有什么区别?

围栏代码块用三个反引号,可以携带语言标识符、文件名等元信息,因此支持语法高亮;缩进代码块每行缩进四个空格,来自最初的 Markdown 1.0 规范,以上能力一概没有。在列表项内部,缩进写法反而更稳妥,因为老解析器容易被围栏搞混。

代码块里的反引号怎么转义?

把围栏写得比要展示的反引号更长:四个反引号可以包住内含三个反引号的内容,五个可以包住四个。行内代码则改用两个反引号作定界符,并在内容两侧各留一个空格,这样中间的单个反引号就能原样显示。

Markdown 里怎么展示 diff?

把语言标识符写成 diff,然后给删除的行加前缀减号、新增的行加前缀加号,未改动的行以空格开头。GitHub、GitLab 以及大多数支持 GitHub Flavored Markdown 的渲染器会自动把它们标成红色和绿色。

怎样给 Markdown 代码块加文件名?

这一点没有统一标准。GitHub 和许多文档主题会读取语言后面的 title 属性,写作 ```js title="app.js"。VuePress 用 ```js:app.js,部分 Jekyll 配置用 fileName="app.js"。不认识这些附加文本的渲染器会直接忽略,代码块仍能正常显示。

Markdown 代码块能显示行号吗?

原生 Markdown 不行。行号由语法高亮器提供,而不属于 Markdown 规范,因此取决于具体平台。Prism 和 highlight.js 都有行号插件,Hugo、MkDocs、Docusaurus 等站点生成器也有对应配置项。GitHub 不会在代码块内显示行号。

怎样在列表项里放代码块?

把整个围栏代码块缩进到与列表项正文对齐——有序列表通常缩进四个空格,无序列表两个——并在前后各留一个空行。缺少这层缩进,围栏会中断列表,代码块会跳回顶层。