测试自定义样式

引用测试

普通文本

数学公式

卡片测试

音乐卡片

Github 卡片

特殊语法

模糊效果

这是一个模糊效果。

对于桌面端，鼠标移入时，会移除模糊效果，点击后会保持3秒清晰显示；对于移动设备，点击后移除模糊效果，当同时满足点击后超过3秒和页面滑动才会变为模糊状态。

拼音

下面的词会显示拼音：

拼pīn音yīn，君きみの名なは

彩虹文字

这是一个彩虹文字效果。

下划线

这个文字下面有下划线效果。

嵌套效果

上面的样式是可以进行嵌套的，比如：

这是一个模糊并且带拼pīn音yīn的彩cǎi虹hóng

链接跳转

正文里的链接默认在当前标签页打开。在链接后面紧跟一段属性块 {target="_blank"}，链接就会在新标签页打开，并在文字后面追加一个右上箭头图标：

欢迎访问 Motues 的 [Blog](https://motues.top){target="_blank"}！

显示如下：

欢迎访问 Motues 的 Blog⁠！

属性块里只识别 target、rel、class 三个属性，写别的属性会整体放弃、按普通文字留在正文里；rel 始终会保留 noopener 与 noreferrer。链接里只有图片时不追加图标，避免箭头压在图片上：

[![封面](./cover.jpg)](https://motues.top "点击查看大图"){target="_blank"}

也可以用来跳转到站内页面，例如 [Markdown 基本功能](/blog/markdown){target="_blank"}，写法完全一样。

脚注

这是文章中的一句话，我需要在这里添加一个引用上标¹。

这是另一句话，引用了另外一个文献²。

Typst 测试

基于 Typst.ts 实现的 Typst 渲染。

图片在黑暗模式情况的效果可能不是很好。

Alert 组件测试

单行内容测试

多行内容测试

嵌套内容测试

console.log('Hello World');

自定义标题测试

Expressive Code 测试

代码块由 Expressive Code 渲染，在语言后面追加选项即可（完整写法见 Markdown 基本功能）：

```js title="src/app.js" {3} ins={4} del={5} showLineNumbers
function greet(name) {
  // 高亮第 3 行
  console.log(`Hello, ${name}!`)
  return true // 新增
  return false // 删除
}
```

效果如下：

1
function greet(name) {
2
  // 高亮第 3 行
3
  console.log(`Hello, ${name}!`)
4
  return true // 新增
5
  return false // 删除
6
}

终端窗口与折叠

frame="terminal" 显示终端窗口（三个圆点），collapse={3-6} 折叠指定行，点击「已折叠 N 行」可以展开：

pnpm install
pnpm build
已折叠 4 行
# 下面是折叠起来的内容
echo "hello"
echo "world"
echo "again"
echo "more"

自动换行与无标题栏

wrap 让过长的代码自动换行，frame="none" 不显示标题栏：

在黑暗森林中，每个文明都是带枪的猎人，像幽灵般潜行于林间，竭力不让脚步发出一点儿声音，连呼吸都必须小心翼翼。