vitepress/docs/zh/guide/markdown-base.md

markdown 基础语法

markdown-it 插件

通过markdown-it 插件，可以实现更多 markdown 功能。

使用

在 doc/.vitepress/config.ts 中引入使用

import mdFootnote from 'markdown-it-footnote'

markdown: {
  config: md => {
    md.use(mdFootnote)
    ...
  },
},

标题

# 一级标题

## 二级标题

### 三级标题

...

::: details 示例

三级标题

四级标题

五级标题

六级标题

:::

标题编号

<!-- 要添加自定义标题ID，请在与标题相同的行上用大括号括起该自定义ID。 -->

### My Great Heading {#custom-id}

字体

加粗

**加粗**

斜体

_斜体_

斜体加粗

**_斜体加粗_**

删除线

~~删除线~~

::: details 示例 加粗

斜体

斜体加粗

删除线

:::

引用

> 这是引用的内容
>
> > 这是引用的内容
> >
> > > > > > 这是引用的内容

<!-- 引用可以嵌套 -->

::: details 示例

这是引用的内容

这是引用的内容

这是引用的内容

:::

分割线

---
---

可以在一行中使用三个或更多的 \* 、 - 或者 \_ 来添加分隔线

::: details 示例

---

:::

换行

<p></p> 或者
<br>

链接

<!-- 注：Markdown本身语法不支持链接在新页面中打开, VitePress 做了处理 -->

[链接文本](链接 'title')
[VitePressCN](https://vanchkong.github.io/VitePressCN 'Vite & Vue 驱动的静态站点生成器')

<!-- 要将URL或电子邮件地址快速转换为链接，请将其括在尖括号中。在 VitePress 中无需次步操作即可自动转换为链接,如果你想禁用自动URL链接，可以用 `` 包裹它 -->

<https://vanchkong.github.io/VitePressCN>
<fake@example.com>

<!-- 为了强调链接，请在方括号之前和圆括号之后添加星号。同上方字体用法 -->

::: details 示例 VitePressCN

https://vanchkong.github.io/VitePressCN

fake@example.com

https://vanchkong.github.io/VitePressCN

https://vanchkong.github.io/VitePressCN

https://vanchkong.github.io/VitePressCN :::

图片

![alt](图片地址 'title')
alt 就是显示在图片下面的文字，相当于对图片内容的解释。
title 是图片的标题，当鼠标移到图片上时显示的内容。

<!-- 图片可以被链接包裹 -->

::: details 示例 :::

列表

无序列表

<!-- 注意：序号跟内容之间要有空格 -->
<!-- 无序列表也可以用 * 替代 - -->

- 无序列表
- 无序列表
- 无序列表
- - 可以替换为 \* 或者 +
    ...

有序列表

1. 有序列表
2. 有序列表
3. 有序列表
   ...

任务列表

<!-- 任务列表基于 mit 插件 markdown-it-task-lists 实现 -->

- [x] 任务列表
- [ ] 任务列表
- [ ] 任务列表

嵌套列表

1. 有序列表
   - 无序列表
   - 无序列表
2. 有序列表

- 无序列表
  1. 有序列表
  2. 有序列表
- 无序列表

::: details 示例

• 无序列表
• 无序列表
• 无序列表

---

1. 有序列表
2. 有序列表
3. 有序列表

---

1. 有序列表
   • 无序列表
   • 无序列表
2. 有序列表

---

• 任务列表
• 任务列表
• 任务列表

---

• 无序列表
  1. 有序列表
  2. 有序列表
• 无序列表 :::

表格

| 居左 | 居中 | 居右 |
| :--- | :--: | ---: |
| 内容 | 内容 | 内容 |
| 内容 | 内容 | 内容 |

::: details 示例

表头	表头	表头
居左内容	居中内容	居右内容
内容	内容	内容
:::

代码块

单行代码块

`单行代码块`

多行代码块

<!-- ```之后可以指定语言类型, ~~~ 可以替换 ``` -->

```md
多行代码块
多行代码块
```

::: details 示例

单行代码块 单行代码块 单行代码块

多行代码块
多行代码块

:::

转义字符

要显示原义字符，否则将用于设置 Markdown 文档中的文本格式 \，请在字符前面添加反斜杠。

\* 如果没有反斜杠，这将是无序列表中的项目符号。

- 如果没有反斜杠，这将是无序列表中的项目符号。

::: details 示例 * 如果没有反斜杠，这将是无序列表中的项目符号。

• 如果没有反斜杠，这将是无序列表中的项目符号。 :::

脚注

<!-- 脚注基于 mit 插件 markdown-it-footnote 实现 -->
<!-- 注解始终出现在页面最下方，即使注解下方仍有其他代码内容 -->

任意文字[^1]
[^1]:解释

任意文字¹

---

1. 解释 ↩︎