Markdown 代码块生成器
选择代码块类型和语言,粘贴代码,即可复制带语法高亮的 Markdown 代码块。全部计算都在你的浏览器本地完成。
Markdown 中怎么写代码块?
在代码上下各单独一行写三个反引号,并在起始反引号后紧跟语言名称——语法高亮正是由这个语言标识符触发的。如果只是句子中的一小段代码,改用单个反引号即可。每行缩进四个空格同样能生成代码块,但无法指定语言。
```python
print("Hello, Markdown!")
```渲染为带 Python 高亮的围栏代码块,对应的 HTML 是 <pre><code class="language-python">。
在线使用 Markdown 代码块生成器
参数设置
输出结果
Markdown 代码块语法详解
Markdown 展示代码有三种写法:围栏代码块、缩进代码块和行内代码。围栏写法是如今的首选,因为只有它能带语言标识符。
带语言的围栏代码块
三个反引号开始、三个反引号结束,语言名称紧跟在起始反引号后面,中间不留空格。GitHub、GitLab、Obsidian、Discord 以及各类静态站点生成器都认这种写法。
```javascript
export function slugify(title) {
return title.toLowerCase().replace(/\s+/g, "-");
}
```渲染为带 JavaScript 高亮的代码块。省略语言标识符时,同样的代码只会显示为无高亮的纯文本。
常用语言标识符列表
标识符就是高亮器认识的一个短名称。下面是最常用的一批;GitHub 通过 Linguist 支持 200 多种,还接受 js、ts、py、sh、yml、cs、c++ 这类别名。
```javascript ```typescript ```python ```java
```c ```cpp ```csharp ```go
```rust ```swift ```kotlin ```php
```ruby ```bash ```sql ```json
```yaml ```html ```css ```diff不同名称对应不同的语法规则。写错标识符不会报错,渲染器只会退回到无高亮的纯文本。
缩进代码块(四个空格)
每行缩进四个空格或一个制表符,这是围栏语法出现之前的原始写法。它到处都能用,但既不能指定语言,代码本身带缩进时也很容易出错。
int main(void) {
printf("Hello, Markdown!\n");
return 0;
}渲染为无高亮的代码块,每行开头的四个空格会被去掉。
句子中的行内代码
单个反引号用于标记正文中的一小段代码,比如变量名、参数或命令。如果这段内容本身包含反引号,就改用两个反引号作为定界符。
部署前先执行 `npm run build`。
`` ` `` 这个字符用来开启行内代码。第一行把 npm run build 显示为等宽字体;第二行原样显示一个反引号,不会提前结束代码段。
用 diff 展示代码变更
diff 标识符按每行的首字符着色:减号表示删除、加号表示新增、空格表示未改动。在 README 或 PR 评论里展示补丁,这是最干净的方式。
```diff
- const timeout = 1000;
+ const timeout = 5000;
retry(request, { timeout });
```GitHub 和 GitLab 会把删除行标红、新增行标绿,未改动的行保持原色。
转义反引号与嵌套围栏
想在代码块里展示另一个代码块,就把外层围栏写得比内层更长:四个反引号可以包住三个,五个可以包住四个,依此类推。
````markdown
```js
console.log("这段围栏不会被提前闭合");
```
````内层的三个反引号会原样显示,而不会提前结束外层代码块。
各平台对 Markdown 代码块的支持
围栏代码块几乎处处可用,但各平台支持的语言数量,以及在此之上的扩展能力差别很大。
| 平台 | 支持情况 | 说明 |
|---|---|---|
| GitHub / GitLab | 完全支持 | 通过 Linguist 支持 200 多种语言,支持 diff 着色,可用 <details> 折叠。 |
| Discord | 完全支持 | 消息中可用 ```语言,语言范围限于 highlight.js 自带的那些。 |
| Slack | 部分支持 | ``` 能生成代码块,但语言标识符会被忽略,没有语法高亮。 |
| Obsidian | 完全支持 | 基于 Prism 高亮,部分代码块(如 mermaid)还会直接渲染成图表。 |
| Notion | 完全支持 | 输入 ``` 自动转成代码块,语言在右上角的下拉框里选择。 |
| 完全支持 | 新版编辑器支持围栏写法;old.reddit.com 仍需使用四空格缩进。 | |
| VS Code | 完全支持 | Markdown 预览和编辑器内都会高亮显示。 |
如何在 Markdown 中插入代码块
选择代码块类型
多行代码选围栏代码块;面对老旧的 Markdown 解析器选缩进代码块;句子中的短片段选行内代码。
选择语言
选中与代码匹配的语言标识符,渲染时才会有语法高亮。日志和终端输出保持纯文本即可。
填写文件名(可选)
围栏代码块可以填一个文件名,输出中会带上 title 属性——写教程时用来标明代码片段属于哪个文件。
粘贴代码并复制
把代码粘贴进编辑框,在预览标签页确认效果,然后复制 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 不会在代码块内显示行号。
怎样在列表项里放代码块?
把整个围栏代码块缩进到与列表项正文对齐——有序列表通常缩进四个空格,无序列表两个——并在前后各留一个空行。缺少这层缩进,围栏会中断列表,代码块会跳回顶层。