Markdown

Markdown 是一种轻量级标记语言，适合编写文档、博客、README、技术笔记等内容。

标题

使用 # 表示标题，# 的数量代表标题级别，最多支持 6 级。

写法：

# 一级标题
## 二级标题
### 三级标题

效果：

一级标题示例

二级标题示例

三级标题示例

段落与换行

普通文本直接书写就是段落。段落之间使用空行分隔。

写法：

这是第一段内容。

这是第二段内容。

第一行  
第二行

效果：

这是第一段内容。

这是第二段内容。

第一行
第二行

强调

使用 * 或 _ 设置斜体，使用 ** 或 __ 设置加粗，使用 ~~ 设置删除线。

写法：

*斜体文本*

**加粗文本**

***加粗并斜体***

~~删除线文本~~

效果：

斜体文本

加粗文本

加粗并斜体

删除线文本

列表

无序列表

使用 -、* 或 + 创建无序列表。

写法：

- Java
- Spring
- Docker

效果：

• Java
• Spring
• Docker

有序列表

使用数字加英文句点创建有序列表。

写法：

1. 安装依赖
2. 编写代码
3. 启动服务

效果：

1. 安装依赖
2. 编写代码
3. 启动服务

嵌套列表

子列表通常缩进两个或四个空格。

写法：

- 后端
  - Java
  - SpringBoot
- 工具
  - Git
  - Docker

效果：

• 后端
  • Java
  • SpringBoot
• 工具
  • Git
  • Docker

链接

使用 [链接文本](链接地址) 创建链接。

写法：

[访问 VitePress 官网](https://vitepress.dev/)

效果：

访问 VitePress 官网

图片

图片语法比链接多一个 !。

写法：

![Logo](/logo.svg)

效果：

引用

使用 > 创建引用内容。

写法：

> 这是一段引用内容。
>
> - 引用中也可以使用列表
> - 引用中也可以使用 **加粗**

效果：

这是一段引用内容。

• 引用中也可以使用列表
• 引用中也可以使用 加粗

代码

行内代码

使用反引号包裹行内代码。

写法：

使用 `npm run dev` 启动项目。

效果：

使用 npm run dev 启动项目。

代码块

使用三个反引号创建代码块，并建议指定语言类型。

写法：

```js
const message = 'Hello Markdown'
console.log(message)
```

效果：

const message = 'Hello Markdown'
console.log(message)

命令示例

写法：

```bash
npm install
npm run dev
```

效果：

npm install
npm run dev

表格

使用 | 分隔列，使用 - 分隔表头和表体。

写法：

| 名称 | 说明 | 示例 |
| --- | --- | --- |
| Git | 版本控制工具 | git status |
| Docker | 容器工具 | docker ps |
| Markdown | 文档语法 | # 标题 |

效果：

名称	说明	示例
Git	版本控制工具	git status
Docker	容器工具	docker ps
Markdown	文档语法	# 标题

表格对齐

写法：

| 左对齐 | 居中 | 右对齐 |
| :--- | :---: | ---: |
| A | B | C |
| 1 | 2 | 3 |

效果：

左对齐	居中	右对齐
A	B	C
1	2	3

分隔线

使用三个或更多 -、* 或 _ 创建分隔线。

写法：

---

效果：

---

任务列表

任务列表常用于待办事项。

写法：

- [x] 完成导航配置
- [x] 创建分类目录
- [ ] 编写技术文章

效果：

• [x] 完成导航配置
• [x] 创建分类目录
• [ ] 编写技术文章

转义字符

如果需要显示 Markdown 特殊字符本身，可以使用反斜杠转义。

写法：

\# 这不是标题
\* 这不是斜体 \*
\[这不是链接\](https://example.com)

效果：

# 这不是标题

* 这不是斜体 *

[这不是链接](https://example.com)

HTML 标签

Markdown 中可以直接写部分 HTML 标签。

写法：

<span style="color: red;">红色文字</span>

<br>

<strong>加粗文字</strong>

效果：

红色文字

加粗文字

VitePress 提示容器

VitePress 支持自定义提示容器，适合写说明、警告和危险提示。

写法：

::: info 信息
用于补充说明背景、上下文或轻量提示。
:::

::: tip 提示
用于强调推荐做法或关键技巧。
:::

::: warning 警告
用于提示潜在风险或需要注意的限制。
:::

::: danger 危险
用于标记破坏性操作、重要风险或不可逆行为。
:::

::: details 点击展开更多
这里适合放置高级说明、折叠示例或额外参考资料。
:::

效果：

信息

用于补充说明背景、上下文或轻量提示。

提示

用于强调推荐做法或关键技巧。

警告

用于提示潜在风险或需要注意的限制。

危险

用于标记破坏性操作、重要风险或不可逆行为。

点击展开更多

这里适合放置高级说明、折叠示例或额外参考资料。

VitePress 代码组

代码组适合展示不同语言或不同工具的实现方式。

写法：

::: code-group

```js [JavaScript]
console.log('Hello')
```

```ts [TypeScript]
const message: string = 'Hello'
console.log(message)
```

:::

效果：

JavaScript

console.log('Hello')

TypeScript

const message: string = 'Hello'
console.log(message)

常用组合示例

下面是一个完整文档片段示例。

写法：

# Git 常用命令

## 查看状态

使用 `git status` 查看当前仓库状态。

```bash
git status
```

## 常用命令

| 命令 | 说明 |
| --- | --- |
| git add . | 添加变更 |
| git commit -m "message" | 提交变更 |
| git push | 推送远程 |

::: tip 建议
提交前先检查变更内容。
:::

效果：

Git 常用命令

查看状态

使用 git status 查看当前仓库状态。

git status

常用命令

命令	说明
git add .	添加变更
git commit -m "message"	提交变更
git push	推送远程

建议

提交前先检查变更内容。