Front-matter of Posts（文章头部信息）#

1
---
2
title: My First Blog Post
3
published: 2023-09-09
4
description: This is the first post of my new Astro blog.
5
image: ./cover.jpg
6
tags: [Foo, Bar]
7
category: Front-end
8
draft: false
9
---

Where to Place the Post Files（文章文件位置）#

文章文件应放在 src/content/posts/ 目录下。你也可以创建子目录来更好地组织文章与资源：

1
src/content/posts/
2
├── post-1.md
3
└── post-2/
4
    ├── cover.png
5
    └── index.md

Markdown Example（Markdown 示例）#

1
| 尺寸 | 材质 | 颜色 |
2
|---|---|---|
3
| 9 | 皮革 | 棕色 |
4
| 10 | 麻布 | 自然色 |
5
| 11 | 玻璃 | 透明 |

1
---

1
行内数学公式：$\omega = d\phi / dt$

1
$$
2
I = \int \rho R^{2} dV
3
$$

GitHub Repository Cards（GitHub 仓库卡片）#

你可以添加动态卡片来链接 GitHub 仓库，页面加载时会从 GitHub API 拉取仓库信息。

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

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

Admonitions（警示框）#

支持以下类型的警示框：note tip important warning caution

NOTE

Highlights information that users should take into account, even when skimming.

TIP

Optional information to help a user be more successful.

IMPORTANT

Crucial information necessary for users to succeed.

WARNING

Critical content demanding immediate user attention due to potential risks.

CAUTION

Negative potential consequences of an action.

1
:::note
2
Highlights information that users should take into account, even when skimming.
3
:::
4
:::tip
5
Optional information to help a user be more successful.
6
:::

1
:::note[MY CUSTOM TITLE]
2
This is a note with a custom title.
3
:::

1
> [!NOTE]
2
> The GitHub syntax is also supported.
3

4
> [!TIP]
5
> The GitHub syntax is also supported.

Expressive Code（代码高亮）#

Expressive Code 提供了语法高亮、终端框、行标记、差异对比、自动换行、可折叠代码、行号等多种功能。完整用法请参考 Expressive Code 官方文档。

Include Video in the Posts（视频嵌入）#

直接复制 YouTube 或其他平台的嵌入代码，粘贴到 markdown 文件中即可。

1
---
2
title: Include Video in the Post
3
published: 2023-10-19
4
// ...
5
---
6
<iframe width="100%" height="468" src="https://www.youtube.com/embed/5gIf0_xpFPI?si=N1WTorLKL0uwLsU_" title="YouTube video player" frameborder="0" allowfullscreen></iframe>