示例展示

字数: 0 字 | 时长: 0 分钟

GitHub 风格的警报

NOTE

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

TIP

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

IMPORTANT

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

WARNING

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

CAUTION

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

代码块聚焦示例

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

代码块中的颜色差异

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

代码组

config.js

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

export default config

config.ts

import type { UserConfig } from 'vitepress'

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

export default config

pnpm

pnpm add vitepress-plugin-group-icons

index.scss

/* .vitepress/theme/style/index.scss */
@use './vp-code.css';
@use './vp-code-group.css';
@use './vp-code-title.css';
@use './rainbow.css';
@use './blur.css';
@use './vars.scss';
@use './vitepress.scss';
@use './medium-zoom.scss';

数学方程

When $a\ne 0$, there are two solutions to $(a{x}^2+bx+c=0)$ and they are

$$x=\frac{-b\pm \sqrt{b^2-4ac}}{2a}$$

Maxwell's equations:

equation	description
$\mathrm{\nabla }\cdot \overrightarrow{\mathbf{B}}=0$	divergence of $\overrightarrow{\mathbf{B}}$ is zero
$\mathrm{\nabla }\times \overrightarrow{\mathbf{E}}+\frac{1}{c}\frac{\partial \overrightarrow{\mathbf{B}}}{\partial t}=\overrightarrow{\mathbf{0}}$	curl of $\overrightarrow{\mathbf{E}}$ is proportional to the rate of change of $\overrightarrow{\mathbf{B}}$
$\mathrm{\nabla }\times \overrightarrow{\mathbf{B}}-\frac{1}{c}\frac{\partial \overrightarrow{\mathbf{E}}}{\partial t}=\frac{4\pi }{c}\overrightarrow{\mathbf{j}}\mathrm{\nabla }\cdot \overrightarrow{\mathbf{E}}=4\pi \rho$	wha?

效果图

浅色模式

深色模式

深色模式

浅色模式