一、Markdown 基础语法测试

粗体，斜体，~~删除线~~，行内代码，超链接。

H₂O，E = mc²。

引用。

嵌套引用。

列表

无序
- 嵌套

有序
第二
1. 子项

已完成
待完成

表格

特性	状态	备注
KaTeX	✅	行内+块级
化学3D	✅	3Dmol.js
ABC乐谱	✅	abcjs
代码高亮	✅	pretty-code
动画	✅	Framer Motion
图表	✅	ECharts+Nivo

左对齐	居中	右对齐
Alpha	Beta	Gamma

分隔线。

脚注

带脚注的句子¹。

HTML 元素

Ctrl + C，高亮，HTML。

🔍 展开查看细节

折叠内容，支持公式：$\int_0^\infty e^{-x^2}dx = \frac{\sqrt{\pi}}{2}$

二、代码块测试

fn main() {
    println!("Hello, 世界！");
    let x = 42;
    let y = x * 2;
    println!("计算结果: {}", y);
}

import asyncio
from typing import Optional

class HermesAgent:
    def __init__(self, name: str = "Hermes"):
        self.name = name

    async def think(self, query: str) -> Optional[str]:
        return f"思考: {query}"

import { create } from 'zustand'

export const useStore = create((set) => ({
  count: 0,
  inc: () => set((s: { count: number }) => ({ count: s.count + 1 })),
}))

{
  "site": { "title": "雍征彼的博客", "author": "Zhengbi Yong" },
  "features": { "katex": true, "chemistry": true, "abc": true }
}

三、KaTeX 数学公式

行内：$E = mc^2$，$e^{i\pi} + 1 = 0$。

块级：

$$ x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a} $$

$$ \hat{f}(\xi) = \int_{-\infty}^{\infty} f(x) e^{-2\pi i x \xi} , dx $$

矩阵：

$$ \begin{pmatrix} a_{11} & a_{12} \ a_{21} & a_{22} \end{pmatrix} $$

麦克斯韦方程组：

$$ \begin{aligned} \nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \ \nabla \cdot \mathbf{B} &= 0 \ \nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \ \nabla \times \mathbf{B} &= \mu_0 \mathbf{J} + \mu_0 \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \end{aligned} $$

分段：

$$ f(x) = \begin{cases} x^2 & x \geq 0 \ -x^2 & x < 0 \end{cases} $$

化学方程式：

$$ \text{2H}_2 + \text{O}_2 \xrightarrow{\text{点燃}} \text{2H}_2\text{O} $$

$$ K_c = \frac{[\text{C}]^c [\text{D}]^d}{[\text{A}]^a [\text{B}]^b} $$

正态分布：

$$ f(x) = \frac{1}{\sigma\sqrt{2\pi}} e^{-\frac{(x-\mu)^2}{2\sigma^2}} $$

四、化学分子结构

2D 结构（RDKit）

咖啡因：

阿司匹林：

青蒿素：

3D 结构（3Dmol.js）

水分子：

苯分子：

分子指纹

青蒿素：

紫杉醇：

五、ABC 乐谱

C 大调音阶：

X:1
T:C 大调音阶
M:4/4
L:1/4
K:C
C D E F | G A B c | c B A G | F E D C |]

小星星：

X:2
T:小星星
M:4/4
L:1/4
K:C
C C G G | A A G2 | F F E E | D D C2 |
G G F F | E E D2 | G G F F | E E D2 |
C C G G | A A G2 | F F E E | D D C2 |]

欢乐颂：

X:3
T:欢乐颂
C:L.v.Beethoven
M:4/4
L:1/4
K:C
E E F G | G F E D | C C D E | E4 D2 |
E E F G | G F E D | C C D E | D4 C2 |]

六、数据可视化图表

ECharts 混合图表

Nivo 柱状图

Nivo 饼图

AntV 柱状图

七、动画组件

✨ FadeIn 动画

淡入效果测试。

👈 SlideIn 左侧滑入

滑入效果测试。

🔍 ScaleIn 缩放

缩放效果测试。

🏀 BounceIn 弹跳

弹跳效果测试。

八、图片与视频

图片

Banner

三列图库：

视频嵌入

Bilibili：

九、测试总结

编号	测试项	结果
T01	文本格式	✅
T02	引用/嵌套引用	✅
T03	列表/任务列表	✅
T04	表格/对齐/脚注	✅
T05	HTML 元素/折叠	✅
T06	代码高亮 (4语言)	✅
T07	KaTeX 行内/块级	✅
T08	KaTeX 矩阵/微积分	✅
T09	RDKit 2D 分子	✅
T10	3Dmol.js 3D 结构	✅
T11	分子指纹	✅
T12	ABC 乐谱 (3首)	✅
T13	ECharts 图表	✅
T14	Nivo 柱状/饼图	✅
T15	AntV 图表	✅
T16	FadeIn/SlideIn/ScaleIn/BounceIn	✅
T17	图片/图库	✅
T18	Bilibili 视频	✅

📊 测试结论：18 项测试全部通过。博客系统完整支持 KaTeX 数学、化学分子结构、ABC 乐谱、多种图表库、动画和媒体嵌入。

本文生成于 2026-05-07，全面测试博客系统渲染能力。

支持 Markdown 的脚注。 ↩

Test

博客全模态能力测试：从数学到音乐，从分子到代码

Test Chemical Structure

Test

博客全模态能力测试：从数学到音乐，从分子到代码

Test Chemical Structure