跳到主要内容

VitePress 容器语法

最后更新于:

image-20260729215928.avif

VitePress 容器语法

文档库继续用 VitePress 写法即可,不必手写 Hugo 短代码。构建时会自动转换成主题能渲染的结构。

常用容器

 1::: tip
 2提示内容
 3:::
 4
 5::: warning
 6警告内容
 7:::
 8
 9::: details 点击展开
10折叠内容,里面可以再写普通 Markdown 或代码块。
11:::

折叠块里放代码

直接写围栏即可,和以前 VitePress 一样:

::: details 原始问题


```text
这里是多行文本……
```


:::

🟢 效果示例

原始问题

有个问题:
01.我想知道,我OneBlog博客项目里一些系统配置/友链各站点logo图片/网站导航里各站点logo图片等  需要用到的图片放在我的OneImg图床(加了eo,后端是七牛云,一个对象存储在线图床)里 是不是比 放在项目本地效果/性能会更好呢?

02.如果这些图片放在线上图床性能更好的话,请帮我实现以下需求:
(1)请把友链里涉及到各站点的logo图片、网站导航里各个站点logo图片都下载下来,然后上传到我的OneImg图床,获取上传后的图片地址后,重新替换对应的站点logo图片地址;(如果有的站点的logo图片无法下载,继续保持当前的容错方案就好)
(2)博客里还有其他本地需要使用到的图片的话,请全部上传到我的OneImg图床,获取上传后的图片地址后,重新替换对应的图片地址;
(3)然后实现一个检测脚本,我需要执行这个脚本后,想知道如下一些信息:
友联页面总共有多少个友联,友联logo图片无法正常获取的有多少个,友联logo图片地址在我OneImg图床图床的有多少个,友联logo图片地址在项目本地的有多少个。
网站导航页面总共有多少个站点,网站导航logo图片无法正常获取的有多少个,网站导航logo图片地址在我OneImg图床图床的有多少个,网站导航logo图片地址在项目本地的有多少个。

说明:构建流水线会把 ::: details 等容器转成主题短代码,并保证内部代码围栏正常高亮;作者侧保持上述 VitePress 语法即可。

最新文章

本页导航