1
console.log('这段代码具有语法高亮！')

1
```js title="my-test-file.js"
2
console.log('带有标题属性的示例')```
3
```markdown
4

5

6
```js title="my-test-file.js"
7
console.log('带有标题属性的示例')
8
```markdown
9

10
---

1
<div>通过注释指定文件名的示例</div>```

1
```bash
2
echo "这个终端外框没有标题"```
3
```markdown
4

5
```bash
6
echo "这个终端外框没有标题"
7
```markdown
8

9
---

1
```sh frame="none"
2
echo "看，没有任何外框！"```
3
```markdown
4

5
```sh frame="none"
6
echo "看，没有任何外框！"
7
```markdown
8

9
---

1
```js {1, 4, 7-8}
2
// 第 1 行 - 通过行号标记
3
// 第 2 行
4
// 第 3 行
5
// 第 4 行 - 通过行号标记
6
// 第 5 行
7
// 第 6 行
8
// 第 7 行 - 通过范围 "7-8" 标记
9
// 第 8 行 - 通过范围 "7-8" 标记```
10
```markdown
11

12
```js {1, 4, 7-8}
13
// 第 1 行 - 通过行号标记
14
// 第 2 行
15
// 第 3 行
16
// 第 4 行 - 通过行号标记
17
// 第 5 行
18
// 第 6 行
19
// 第 7 行 - 通过范围 "7-8" 标记
20
// 第 8 行 - 通过范围 "7-8" 标记
21
```markdown
22

23
#### 选择行标记类型 (mark, ins, del)

1
```jsx {"1":5} del={"2":7-8} ins={"3":10-12}
2
// labeled-line-markers.jsx
3
<button
4
  role="button"
5
  {...props}
6
  value={value}
7
  className={buttonClassName}
8
  disabled={disabled}
9
  active={active}
10
>
11
  {children &&
12
    !active &&
13
    (typeof children === 'string' ? <span>{children}</span> : children)}
14
</button>```
15
```markdown
16

17
```jsx {"1":5} del={"2":7-8} ins={"3":10-12}
18
// labeled-line-markers.jsx
19
<button
20
  role="button"
21
  {...props}
22
  value={value}
23
  className={buttonClassName}
24
  disabled={disabled}
25
  active={active}
26
>
27
  {children &&
28
    !active &&
29
    (typeof children === 'string' ? <span>{children}</span> : children)}
30
</button>
31
```markdown
32

33
#### 添加长标签

1
```diff
2
+这一行将被标记为已插入
3
-这一行将被标记为已删除
4
这是一行普通代码```
5
```markdown
6

7
```diff
8
+这一行将被标记为已插入
9
-这一行将被标记为已删除
10
这是一行普通代码
11
```markdown
12

13
---

1
```diff lang="js"
2
  function thisIsJavaScript() {
3
    // 整个代码块按 JavaScript 高亮，
4
    // 同时我们仍然可以添加 diff 标记！
5
-   console.log('旧的代码将被移除')
6
+   console.log('全新的闪亮代码！')
7
  }```
8
```markdown
9

10
```diff lang="js"
11
  function thisIsJavaScript() {
12
    // 整个代码块按 JavaScript 高亮，
13
    // 同时我们仍然可以添加 diff 标记！
14
-   console.log('旧的代码将被移除')
15
+   console.log('全新的闪亮代码！')
16
  }
17
```markdown
18

19
#### 标记行内的特定文本

1
function demo() {
2
  // 标记行内任何出现的“指定文本”
3
  return '支持多次匹配指定文本';
4
}```

1
function demo() {
2
  // 标记行内任何出现的“指定文本”
3
  return '支持多次匹配指定文本';
4
}

1
```ts /ye[sp]/
2
console.log('单词 yes 和 yep 都将被标记。')```
3
```markdown
4

5
```ts /ye[sp]/
6
console.log('单词 yes 和 yep 都将被标记。')
7
```markdown
8

9
#### 标记行内标记类型 (mark, ins, del)

1
function demo() {
2
  console.log('这些是 inserted 和 deleted 标记类型');
3
  // return 语句使用默认标记类型
4
  return true;
5
}```

1
function demo() {
2
  console.log('这些是 inserted 和 deleted 标记类型');
3
  // return 语句使用默认标记类型
4
  return true;
5
}

1
```js wrap
2
// 开启换行的示例
3
function getLongString() {
4
  return '这是一段非常长的字符串，如果不开启自动换行，它很可能超出现在容器的显示范围，除非容器极宽。'
5
}```
6
```markdown
7

8
```js wrap
9
// 开启换行的示例
10
function getLongString() {
11
  return '这是一段非常长的字符串，如果不开启自动换行，它很可能超出现在容器的显示范围，除非容器极宽。'
12
}
13
```markdown
14

15
---

1
// 关闭换行的示例 (wrap=false)
2
function getLongString() {
3
  return '这是一段非常长的字符串，如果不开启自动换行，它很可能超出现在容器的显示范围，除非容器极宽。'
4
}```

1
// 关闭换行的示例 (wrap=false)
2
function getLongString() {
3
  return '这是一段非常长的字符串，如果不开启自动换行，它很可能超出现在容器的显示范围，除非容器极宽。'
4
}

1
```js wrap preserveIndent
2
// 保持缩进示例 (默认开启)
3
function getLongString() {
4
  return '长字符串换行后会保持与上一行相同的缩进位置。'
5
}```
6
```markdown
7

8
```js wrap preserveIndent
9
// 保持缩进示例 (默认开启)
10
function getLongString() {
11
  return '长字符串换行后会保持与上一行相同的缩进位置。'
12
}
13
```markdown
14

15
---

1
// 关闭保持缩进示例 (preserveIndent=false)
2
function getLongString() {
3
  return '长字符串换行后将不再保持缩进，而是从行首开始。'
4
}```

1
// 关闭保持缩进示例 (preserveIndent=false)
2
function getLongString() {
3
  return '长字符串换行后将不再保持缩进，而是从行首开始。'
4
}

1
.expressive-code :not(:is(svg, svg *)) {
2
    max-height: revert; /* 同优先级下会反悔我们的声明 */
3
}