hero-image
Last updated on

博客语法展示


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

头部字段

源码:

---
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
---

字段说明:

字段类型必填作用
titlestring文章标题
descriptionstring文章摘要和页面描述
pubDatedate/string发布时间,会参与排序和归档
updatedDatedate/string最后更新时间
heroImagestring文章顶部头图
hiddenbooleantrue 时不出现在首页和文章列表
pinboolean首页文章排序时置顶

标题

源码:

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

效果:

一级标题

二级标题

三级标题

段落与强调

源码:

这是普通段落。

**加粗文本***斜体文本*~~删除线文本~~
`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}
$$

效果:

行内公式:a2+b2=c2a^2+b^2=c^2

块级公式:

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

Bilibili 视频

源码:

[bili id="BV1qw41167e4"]

效果:

Bilibili 原视频 ↗

参数说明:

参数必填默认值作用
id视频 BV 号或 AV 号,例如 BV1qw41167e4
page1分 P 页码
autoplayoff写成 on 时传给播放器自动播放参数

可选写法:

[bili]BV1qw41167e4[/bili]

带参数写法:

[bili id="BV1qw41167e4" page="1" autoplay="off"]

加密块

源码:

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

这是一段被加密的内容。

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

[/lock]

效果:

输入 demo 查看内容

参数说明:

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

注意:

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

分割线

源码:

---

效果:


HTML

源码:

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

效果:

Ctrl + K