扩展

pengzhanbo

1300字约4分钟

2024-03-05

标题锚点

标题会自动应用锚点。

自定义锚点

要为标题指定自定义锚点而不是使用自动生成的锚点,请向标题添加后缀:

# 使用自定义锚点 {#my-anchor}

这允许将标题链接为 #my-anchor,而不是默认的 #使用自定义锚点

链接

内部和外部链接都会被特殊处理。

主题默认对每个 md 文件自动生成一个新的 链接,并保存在对应的 md 文件的 frontmatter 的 permalink 中。 你可以随时修改它们。

内部链接

建议使用 生成的 permalink 作为内部链接的目标。

[Markdown](/guide/markdown/)

渲染为:

Markdown

外部链接

外部链接带有 target="_blank" rel="noreferrer"

VuePress

Github风格的表格

输入:

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

输出:

TablesAreCool
col 3 isright-aligned$1600
col 2 iscentered$12
zebra stripesare neat$1

Emoji 🎉

输入:

:tada: :100:

输出:

🎉 💯

这里可以找到 所有支持的 emoji 列表

目录表

输入:

[[TOC]]

输出:

自定义容器

自定义容器可以通过它们的类型、标题和内容来定义。

默认标题

输入:

::: note
This is a note box
:::

::: info
This is an info box.
:::

::: tip
This is a tip.
:::

::: warning
This is a warning.
:::

::: caution
This is a dangerous warning.
:::

::: details
This is a details block.
:::

输出:

This is a note box

相关信息

This is an info box.

提示

This is a tip.

注意

This is a warning.

警告

This is a dangerous warning.

详情

This is a details block.

自定义标题

可以通过在容器的 "type" 之后附加文本来设置自定义标题。

输入:

::: caution STOP
危险区域,请勿继续
:::

::: details 点我查看代码
```js
console.log('Hello, VitePress!')
```
:::

输出:

STOP

危险区域,请勿继续

点我查看代码
console.log('Hello, VitePress!')

GitHub 风格的警报

主题 同样支持以标注的方式渲染 GitHub 风格的警报。它们和自定义容器的渲染方式相同。

输入:

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

> [!TIP]
> 有助于用户更顺利达成目标的建议性信息。

> [!IMPORTANT]
> 对用户达成目标至关重要的信息。

> [!WARNING]
> 因为可能存在风险,所以需要用户立即关注的关键内容。

> [!CAUTION]
> 行为可能带来的负面影响。

输出:

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

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

重要

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

注意

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

警告

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

数学方程

输入:

When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0)$ and they are
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$

**Maxwell's equations:**

| equation                                                                                                                                                                  | description                                                                            |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- |
| $\nabla \cdot \vec{\mathbf{B}}  = 0$                                                                                                                                      | divergence of $\vec{\mathbf{B}}$ is zero                                               |
| $\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t}  = \vec{\mathbf{0}}$                                                          | curl of $\vec{\mathbf{E}}$ is proportional to the rate of change of $\vec{\mathbf{B}}$ |
| $\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} = \frac{4\pi}{c}\vec{\mathbf{j}}    \nabla \cdot \vec{\mathbf{E}} = 4 \pi \rho$ | _wha?_                                                                                 |

输出:

When a0a \ne 0, there are two solutions to (ax2+bx+c=0)(ax^2 + bx + c = 0) and they are

x=b±b24ac2a x = {-b \pm \sqrt{b^2-4ac} \over 2a}

Maxwell's equations:

equationdescription
B=0\nabla \cdot \vec{\mathbf{B}} = 0divergence of B\vec{\mathbf{B}} is zero
×E+1cBt=0\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} = \vec{\mathbf{0}}curl of E\vec{\mathbf{E}} is proportional to the rate of change of B\vec{\mathbf{B}}
×B1cEt=4πcjE=4πρ\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} = 4 \pi \rhowha?

标记

使用 == == 进行标记。请注意两边需要有空格。

输入:

vuepress-theme-plume 是一个 ==简洁美观== 的 主题

输出:

vuepress-theme-plume 是一个 简洁美观 的 主题

上下角标

  • 使用 ^ ^ 进行上角标标注。
  • 使用 ~ ~ 进行下角标标注。

输入:

- 19^th^
- H~2~O

输出:

  • 19th
  • H2O

自定义对齐

输入:

::: left
左对齐的内容
:::

::: center
居中的内容
:::

::: right
右对齐的内容
:::

输出:

左对齐的内容

居中的内容

右对齐的内容

属性支持

你可以使用特殊标记为 Markdown 元素添加属性。

为图片添加属性:

这将为图片添加 一个 名为 full-width 的 class 属性,以及一个 width 属性,值为 100%

![](/plume.png){.full-width width="100%"}

同时也支持其他属性:

一个包含文字的段落。 {#p .a .b align=center customize-attr="content with spaces"}

这将被渲染为:

<p id="p" class="a b" align="center" customize-attr="content with spaces">
  一个包含文字的段落。
</p>

任务列表

输入:

- [ ] 任务 1
- [x] 任务 2
- [ ] 任务 3

输出:

脚注

输入:

人生自古谁无死,留取丹心照汗青[^脚注1]

[^脚注1]: 出自 宋·文天祥 **《过零丁洋》**

输出:

人生自古谁无死,留取丹心照汗青[1]


  1. 出自 宋·文天祥 《过零丁洋》 ↩︎