GitHub 仓库卡片#

你可以添加指向 GitHub 仓库的动态卡片，页面加载时会通过 GitHub API 获取仓库信息。

Fabrizz/MMM-OnSpotify

使用以下代码创建 GitHub 仓库卡片： ::github{repo="<owner>/<repo>"}.

1
::github{repo="saicaca/fuwari"}

Mermaid 图表#

mermaid 围栏代码块会渲染为图表，并适配当前配色方案。

flowchart LR
    accTitle: Markdown 渲染流程
    accDescr: Markdown 源码被转换为语义化 HTML，再增强为带有主题样式的 SVG 图表。
    A[Markdown 源码] --> B[Astro 内容处理流程]
    B --> C[语义化 HTML]
    C --> D[主题化图表]

提示块#

支持以下提示块类型： note tip important warning caution

1
:::note
2
突出显示即使快速浏览也应留意的信息。
3
:::
4

5
:::tip
6
提供可选信息，帮助读者更顺利地完成操作。
7
:::

1
:::note[我的自定义标题]
2
这是一条带有自定义标题的提示。
3
:::

1
> [!NOTE]
2
> 也支持 GitHub 语法。
3

4
> [!TIP]
5
> 也支持 GitHub 语法。

1
这段内容:spoiler[藏起来了，**嘿嘿**]！

图片宽度与图注#

独立图片的替代文本中可以添加可选的 w-N% 宽度标记；Markdown 标题则会渲染为图片下方居中的图注：

1
![图片说明 w-50%](./image.webp "可见图注")

有效宽度范围为 w-1% 到 w-100%；无效标记会留在替代文本中。宽度和图注相互独立，仅设置标题也会生成图注：