这篇文章用于测试和备忘本博客支持的写法。每一节都先展示源码，再展示实际效果。

头部字段

源码：

---
title: "文章标题"
description: "一句话描述，会用于文章列表和页面描述。"
pubDate: "2026-06-20"
updatedDate: "2026-06-20"
heroImage: "/images/blog/2024/fix-picgo-compression/lwziif-0-fd2b6d6237.png"
hidden: false
pin: false
---

字段说明：

字段	类型	必填	作用
title	string	是	文章标题
description	string	是	文章摘要和页面描述
pubDate	date/string	是	发布时间，会参与排序和归档
updatedDate	date/string	否	最后更新时间
heroImage	string	否	文章顶部头图
hidden	boolean	否	true 时不出现在首页和文章列表
pin	boolean	否	首页文章排序时置顶

标题

源码：

# 一级标题
## 二级标题
### 三级标题

效果：

一级标题

二级标题

三级标题

段落与强调

源码：

这是普通段落。

**加粗文本**，*斜体文本*，~~删除线文本~~。
`inline code` 可以用于短代码、命令和变量名。

效果：

这是普通段落。

加粗文本，斜体文本，删除线文本。 inline code 可以用于短代码、命令和变量名。

列表

源码：

- 无序列表 A
- 无序列表 B

1. 有序列表 A
2. 有序列表 B

效果：

• 无序列表 A
• 无序列表 B

1. 有序列表 A
2. 有序列表 B

引用

源码：

> 这是一段引用。
> 可以连续写多行。

效果：

这是一段引用。 可以连续写多行。

链接

源码：

[CoolArec](https://coolarec.link)

效果：

CoolArec

图片

源码：

![设置里设置代理和镜像地址](/images/blog/2024/fix-picgo-compression/lwziif-0-fd2b6d6237.png)

效果：

说明：图片右下角会显示 ![这里] 的文字，点击图片可以打开灯箱。

参数说明：

位置	必填	作用
![alt]	否	图片说明文字；本博客会把它显示在图片右下角
(url)	是	图片地址
"title"	否	Markdown 标准图片标题；本博客目前不额外展示

完整写法：

![图片说明](/images/blog/2024/fix-picgo-compression/lwziif-0-fd2b6d6237.png "图片标题")

表格

源码：

| 名称 | 说明 |
| --- | --- |
| Markdown | 内容格式 |
| Astro | 站点框架 |

效果：

名称	说明
Markdown	内容格式
Astro	站点框架

代码块

源码：

```cpp
#include <bits/stdc++.h>
using namespace std;

int main() {
  cout << "hello blog\n";
  return 0;
}
```

效果：

#include <bits/stdc++.h>
using namespace std;

int main() {
  cout << "hello blog\n";
  return 0;
}

数学公式

源码：

行内公式：$a^2+b^2=c^2$

块级公式：

$$
\begin{aligned}
f(n) &= \sum_{i=1}^{n} i \\
     &= \frac{n(n+1)}{2}
\end{aligned}
$$

效果：

行内公式：$a^2+b^2=c^2$

块级公式：

$$\begin{aligned} f(n) &= \sum_{i=1}^{n} i \\ &= \frac{n(n+1)}{2} \end{aligned}$$

Bilibili 视频

源码：

import Bilibili from "@/components/Bilibili.astro";

<Bilibili id="BV1qw41167e4" />

效果：

参数说明：

参数	必填	默认值	作用
id	是	无	视频 BV 号或 AV 号，例如 BV1qw41167e4
page	否	1	分 P 页码
autoplay	否	false	是否自动播放，支持布尔值 true/false 或字符串 "on"/"off"

带参数写法：

<Bilibili id="BV1qw41167e4" page="1" autoplay="off" />

PDF 演示

由于原生 PPTX 格式在浏览器中不能被直接解码，且在线服务高度依赖网络质量，推荐的做法是在本地将 PPTX 文件另存为 PDF 文件，然后使用 <PDFViewer /> 组件嵌入。

PDF 预览完全在本地（客户端）解码与加载，不受任何网络状况限制，在本地开发环境 (localhost) 也能实现秒开和 100% 稳定运行。

源码：

import PDFViewer from "@/components/PDFViewer.astro";

<PDFViewer src="/static/2026/syntax-guide/GIT下载安装.pdf" />

效果：

参数说明：

参数	必填	默认值	作用
src	是	无	PDF 文件的绝对路径（通常存放在 public/ 目录下，以 / 开头）
width	否	'100%'	预览容器的宽度
height	否	'600px'	预览容器的高度

加密块

源码：

[lock pass="demo" des="输入 demo 查看内容"]

这是一段被加密的内容。

![加密块内的图片也支持标题](/images/blog/2024/fix-picgo-compression/lwziif-0-fd2b6d6237.png)

[/lock]

效果：

参数说明：

参数	必填	默认值	作用
pass	是	无	解锁密码
des	否	This content is locked.	锁定块展示的提示文字

注意：

• [lock ...] 和 [/lock] 建议单独占一行。
• 如果锁内有图片，图片语法前后最好留空行。
• des 和 pass 支持普通英文引号，也兼容中文弯引号。

分割线

源码：

---

效果：

---

HTML

源码：

<kbd>Ctrl</kbd> + <kbd>K</kbd>

效果：

Ctrl + K