样式预览

目录表

[[TOC]]

标题

二级标题

三级标题

四级标题

五级标题

六级标题

强调

强调

斜体

斜体

斜体并强调

删除线

删除线

下划线

下划线

分隔线

---

高亮

高亮

引用

引用

表格

Tables	Are	Cool
col 3 is	right-aligned	$1600
col 2 is	centered	$12
zebra stripes	are neat	$1

无序列表

• 第一行
• 第二行
• 第三行

有序列表

1. 第一行
2. 第二行
3. 第三行

上下标

这是^上标，这是_下标

图片

单张图片：

调整图片的大小并且居中：

图片并排且中间有间距：

链接

Google

内联 $LATEX$ 公式

行内公式：$E=m{c}^2$

块级公式：

$${\int }_0^{\mathrm{\infty }}{e}^{-x^2}dx=\frac{\sqrt{\pi }}{2}$$

舒展公式：在公式前加入 \displaystyle

${\displaystyle {\int }_0^{1}f(x)dx}$

${\displaystyle \sum _{i=1}^n}$

应用在分式上时，直接在 \frac 前面加 d 变为 \dfrac

${\displaystyle \frac{{\displaystyle \frac{a}{c}}-4x}{b-{\displaystyle \frac{a}{b}}}}$

徽标

Title default

Title ^1.9.0

Title beta

Title caution

代码

code

代码块

print("Hello world!\n");

代码块标题：

first.py

print("Hello world!")

在代码块中实现行高亮：

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

代码块中聚焦：

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

代码块中的颜色差异：

export default {
  data () {
    return {
      msg: 'Removed'
      msg: 'Added'
    }
  }
}

高亮“错误”和“警告”：

export default {
  data () {
    return {
      msg: 'Error', 
      msg: 'Warning'
    }
  }
}

添加行号：

// 启用行号
const line2 = 'This is line 2'
const line3 = 'This is line 3'

代码组

config.js

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

export default config

config.ts

import type { UserConfig } from 'vitepress'

const config: UserConfig = {
  // ...
}

export default config

自定义容器

NOTE

强调用户在快速浏览文档时也不应忽略的重要信息。

TIP

有助于用户更顺利达成目标的建议性信息。

IMPORTANT

对用户达成目标至关重要的信息。

WARNING

因为可能存在风险，所以需要用户立即关注的关键内容。

CAUTION

行为可能带来的负面影响。

Details

折叠和展开详细信息。

可以自定义标题：

信息

强调用户在快速浏览文档时也不应忽略的重要信息。

提示

有助于用户更顺利达成目标的建议性信息。

重要

对用户达成目标至关重要的信息。

警告

因为可能存在风险，所以需要用户立即关注的关键内容。

危险

行为可能带来的负面影响。

详细信息

折叠和展开详细信息。