Chapter 05 / 10

代码块与语法高亮

内联代码、围栏代码块、语法高亮与 diff 的完整用法

内联代码

用反引号 ` 包裹，显示为等宽字体，适合代码片段、文件名、命令等：

源码
使用 `npm install` 安装依赖。
变量 `userName` 存储用户名。
修改 `src/config.js` 文件。
渲染效果

使用 npm install 安装依赖。

变量 userName 存储用户名。

修改 src/config.js 文件。

内联代码中包含反引号

用多个反引号包裹，可以在内联代码中包含反引号字符：

``使用 ` 代码 ` 反引号``

``var x = `template ${literal}` ``

围栏代码块（Fenced Code Block）

用三个反引号（\`\`\`）或三个波浪线（~~~）围起来，创建多行代码块：

源码
```python
def hello(name):
    print(f"Hello, {name}!")

hello("世界")
```
渲染效果
def hello(name):
    print(f"Hello, {name}!")

hello("世界")

语法高亮

在开始的三个反引号后指定语言，渲染器会据此应用语法高亮：

语言标注用途
python / pyPython 代码
javascript / jsJavaScript 代码
typescript / tsTypeScript 代码
bash / sh / shellShell 命令
sqlSQL 查询
jsonJSON 数据
yaml / ymlYAML 配置
html / xmlHTML/XML
css / scss样式表
go / rust / java / c / cpp系统语言
dockerfileDockerfile
markdown / mdMarkdown 本身
TIP语言标注不区分大小写（Python 和 python 都可以）。如果不确定语言标识符，可以到 highlight.js 文档 查询完整列表。

diff 代码块

用 diff 语言标注，配合 + / - 前缀，显示代码变更：

```diff
 function hello(name) {
-  console.log("Hello " + name);
+  console.log(`Hello, ${name}!`);
 }
```
function hello(name) {
- console.log("Hello " + name);
+ console.log(`Hello, ${name}!`);
}

缩进代码块（旧式语法）

用 4 个空格缩进也可以创建代码块（旧式语法，不支持语言指定）：

    这是缩进代码块
    每行前面有 4 个空格
WARNING不推荐使用缩进代码块：它不支持语言标注，且在列表内容中可能产生歧义。统一使用围栏代码块（三个反引号）。

代码块中的转义

代码块和内联代码内部的 Markdown 语法不会被解析，直接按字面量显示：

```
**这里不会变成加粗**
# 这里不会成为标题
```

GitHub 代码块增强

GitHub 支持一些特殊语言标注：

# 终端输出（无高亮但有特殊样式）
```console
$ npm install
added 120 packages in 3s
```

# 数学公式（GitHub 支持 LaTeX）
```math
E = mc^2
```

小结