常用的博客语法，v1.0.0-rc.184

引言块

> 123

123

> ## This is a header.
>
> 1. This is the first list item.
> 2. This is the second list item.
>
> Here's some example code:
>
>     return shell_exec("echo $input | $markdown_script");

This is a header.

1. This is the first list item.
2. This is the second list item.

Here's some example code:

return shell_exec("echo $input | $markdown_script");

马克笔

我写得很不错，看起来很舒服

==一个提示=={.tip} 
==一个警告=={.warning}
==一个错误=={.danger}
==重要内容=={.important}

一个提示 一个警告 一个错误 重要内容

提示框

::: note
这是一个注释框
:::

::: info
这是一个信息框
:::

::: tip
这是一个提示框
:::

::: warning
这是一个警告框
:::

::: caution
这是一个危险警告框
:::

::: details
这是一个详情折叠框
:::
::: details 点我查看代码
```js
console.log('Hello, VitePress!')

:::

注

这是一个注释框

相关信息

这是一个信息框

提示

这是一个提示框

注意

这是一个警告框

警告

这是一个危险警告框

详情

这是一个详情折叠框

STOP

危险区域，请勿继续

点我查看代码

console.log('Hello World!')

步骤、时间线

1. 步骤 1

   console.log('Hello World!')

2. 步骤 2

   这里是步骤 2 的相关内容

3. 步骤 3

   提示

   提示容器

4. 结束

---

节点一

正文内容

2025-03-20

节点二

正文内容

2025-02-21

节点三

正文内容

2025-01-22

文件树

::: file-tree icon="simple"
- docs
  - .vuepress
    - config.ts
  - page1.md
  - README.md
- package.json
:::

docs

.vuepress

config.ts

page1.md

README.md

package.json

折叠展开面板

标题 1

正文内容

标题 2

正文内容

标题 3

正文内容

代码块

代码块标题

	```md title="readme.md"
	read me
	```

readme.md

read me

高亮

	```js{4} 
	export default { 
		data () { 
			return { 
				msg: 'Highlighted!' 
			} 
		} 
	} 
	```

export default {
  data () {
    return {
      msg: 'Highlighted!'
    }
  }
}

• 多行：例如 {5-8}、{3-10}、{10-17}
• 多个单行：例如 {4,7,9}
• 多行与单行：例如 {4,7-13,16,23-27,40}
• 也可以使用 // [!code highlight] 注释实现行高亮。

折叠代码块

在 代码块 后面添加 :collapsed-lines，即可折叠代码块，默认从第 15 行开始折叠。 可以指定起始折叠行。:collapsed-lines=10 表示从第十行开始折叠。

代码块分组

::: code-tabs
@tab config.js
```js
/**
 * @type {import('vuepress').UserConfig}
 */
const config = {
  // ..
}
export default config

```
  

@tab config.ts
```ts
import type { UserConfig } from 'vuepress'

const config: UserConfig = {
  // ..
}

export default config
```
:::

config.js

/**
 * @type {import('vuepress').UserConfig}
 */
const config = {
  // ..
}

export default config

config.ts

import type { UserConfig } from 'vuepress'
  
const config: UserConfig = {
  // ..
}

export default config