跳转到内容
陆上江南
返回

Markdown 功能测试 — 中文排版验证

更新于:
编辑页面

引言

这是一篇功能验证文章,用来测试 AstroPaper 主题对 Markdown 各语法的渲染效果,以及中文排版的展示质量。如果你能看到这篇内容且排版正常,说明主题运行良好。

工欲善其事,必先利其器。一个好的博客主题,应该让写作回归内容本身。

文本样式

这段文字包含了 加粗斜体加粗斜体删除线行内代码超链接

AstroPaper 默认不支持 <mark> 高亮标签,但你可以通过 Tailwind 扩展。

标题层级

三级标题

四级标题

五级标题

列表

无序列表

有序列表

  1. 第一步:搭建环境
  2. 第二步:编写内容
  3. 第三步:部署上线

任务列表(如果支持)

代码块

TypeScript 示例:

// 计算斐波那契数列
function fibonacci(n: number): number {
  if (n <= 1) return n;
  return fibonacci(n - 1) + fibonacci(n - 2);
}

console.log(fibonacci(10)); // 55

带 diff 标注:

- const oldGreeting = "Hello, World!";
+ const greeting = "你好,世界!";
+ console.log(greeting);

Python 示例:

def quick_sort(arr: list) -> list:
    if len(arr) <= 1:
        return arr
    pivot = arr[0]
    left = [x for x in arr[1:] if x <= pivot]
    right = [x for x in arr[1:] if x > pivot]
    return quick_sort(left) + [pivot] + quick_sort(right)

表格

特性状态说明
中文排版字体间距正常
代码高亮双主题切换正常
暗色模式跟随系统或手动切换
响应式移动端适配良好
RSS订阅地址 /rss.xml

引用

书山有路勤为径,学海无涯苦作舟。

— 韩愈《增广贤文》

嵌套引用:

第一层引用

第二层引用

第三层引用

数学公式(LaTeX)

行内公式:$E = mc^2$

块级公式:

$$ \int_{a}^{b} f(x) , dx = F(b) - F(a) $$

分割线


图片

示例图片

上图来自 Unsplash,用于测试外部图片加载。

脚注(如果支持)

这里有一个脚注引用1

HTML 标签测试

居中文本
点击展开折叠内容 这里是隐藏的细节信息,用 HTML `
` 标签实现。

结语

以上覆盖了 Markdown 的主要语法和中文排版场景。如果你发现任何样式问题,可以调整 @tailwindcss/typography 的配置或修改 src/styles/typography.css


文章首次发布后进行了内容补充,验证修改日期 modDatetime 功能。

Footnotes

  1. 这是脚注内容,用于验证脚注渲染是否正常。


编辑页面
分享这篇文章:

上一篇
Dynamic OG image generation in AstroPaper blog posts
下一篇
How to add LaTeX Equations in Astro blog posts