Markdown 代码(七)

7.代码

涵盖行内代码、代码块、语法高亮及高级特性。

一、行内代码

使用 反引号 ` 包围代码片段。

`printf()` 函数

常见用法示例

  • 函数名:console.log()
  • 变量名:userName
  • 命令行:npm install
  • 键盘按键:Ctrl+C
  • 文件名:index.html

特殊字符转义

场景 语法
显示单反引号 用双反引号包围:`code`
显示双反引号 用多个反引号包围:``code``
HTML标签 直接写 <div>(Markdown 不转义 HTML)

二、代码块

2.1 缩进式代码块

每行前加 4 个空格 或 1 个制表符(Tab)。

正常文本段落

    这是缩进式代码块
    每行前面有四个空格
    
继续正常文本

注意事项

  • 代码块前后需空行分隔
  • 所有行保持一致缩进
  • 不支持语法高亮
  • 列表内使用时需 8 个空格 缩进

2.2 三反引号代码块(推荐)

使用三个反引号 ** ``` ** 包裹代码,可指定语言。支持语法高亮和多行代码展示。

```
多行代码内容
可以包含空行
保持原有缩进
‍```

指定语言示例

$(document).ready(function () {
    alert('RUNOOB');
});

三、语言标识与语法高亮

在三反引号后添加语言标识符(如 javascript​、python​、sql)可启用语法高亮。

常用语言标识符

语言 标识符
JavaScript javascript​ / js
Python python​ / py
HTML html
CSS css
SQL sql
JSON json
Bash/Shell bash​ / shell
Java java
C++ cpp
C# csharp
Go go
TypeScript typescript​ / ts

四、代码块高级特性

部分渲染器支持

4.1 显示行号

```javascript {.line-numbers}
function fibonacci(n) {
    if (n <= 1) return n;
    return fibonacci(n-1) + fibonacci(n-2);
}
‍```

showLineNumbers 语法。

4.2 代码差异对比(Diff)

使用 diff 标识:

  • - 开头表示删除的行
  • + 开头表示新增的行
```diff
function calculateTotal(items) {
-   let total = 0;
+   let total = 0.0;
    for (let item of items) {
-       total += item.price;
+       total += parseFloat(item.price);
    }
    return total;
}
‍```

image

Git 风格差异块:

```diff
@@ -1,5 +1,8 @@
 function greetUser(name) {
-    console.log("Hello " + name);
+    if (!name) throw new Error("Name required");
+    console.log(`Hello, ${name}!`);
 }
‍```

总结速查表

类型 语法 说明
行内代码 `code` 单个反引号
行内含反引号 双反引号包围
缩进代码块 每行前4空格 无语法高亮
三反引号代码块 ``` 推荐,支持语法高亮
指定语言 ```javascript 启用高亮
行号显示 ```javascript {.line-numbers} 扩展语法
Diff高亮 ```diff +​/- 标记变更

最佳实践

  • 行内代码用 `
  • 多行代码用 ``` + 语言标识符
  • 版本差异展示用 ```diff