一级标题：Markdown 排版实验室

这是一篇用于验证博客渲染能力的示例文章。它覆盖日常技术写作中常见的 Markdown 与 GitHub Flavored Markdown 语法，包括 粗体、斜体、粗斜体、删除线、行内代码 和 外部链接。

普通段落应该有舒适的行高、稳定的字符宽度和清晰的上下间距。中文与 English、数字 2026、技术名词 Cloudflare Workers 混排时，也应保持自然。

二级标题：文本与链接

你可以使用自动链接：https://vinkm.com，也可以创建带说明的链接：访问 vinkm 技术博客。

转义字符可以显示 Markdown 符号：*这不是斜体*，而是普通星号。

三级标题：引用

好的技术文章不只给出结论，还应该解释约束、取舍和验证过程。

引用块可以包含多个段落，也可以包含 强调文本 和 code。

四级标题：无序列表

• Cloudflare
  • Workers：边缘运行时
  • D1：关系型元数据
  • R2：Markdown 与图片
• TypeScript
• 服务端渲染与 SEO

五级标题：有序列表

1. 建立数据模型
2. 编写服务端渲染
3. 增加管理后台
4. 部署并验证
   1. 类型检查
   2. 数据库迁移
   3. 线上冒烟测试

六级标题：任务列表

• Worker 路由
• D1 数据库
• R2 文件存储
• Markdown 编辑与预览
• 写更多真实项目文章

代码展示

行内代码适合变量名，例如 env.DB、request.url 与 ctx.waitUntil()。

interface Env {
  DB: D1Database;
  CONTENT: R2Bucket;
}

export default {
  async fetch(request: Request, env: Env): Promise<Response> {
    const posts = await env.DB
      .prepare("SELECT title, slug FROM posts WHERE status = ?")
      .bind("published")
      .all();

    return Response.json(posts.results);
  },
} satisfies ExportedHandler<Env>;

npm run typecheck
npx wrangler d1 migrations apply vinkm-blog-db --remote
npx wrangler deploy

{
  "name": "vinkm-blog",
  "runtime": "Cloudflare Workers",
  "storage": ["D1", "R2"],
  "seo": true
}

表格

图片

下面引用站点生成的 Logo，用于验证图片缩放、透明背景、圆角和留白。

混合内容

1. 列表中可以包含代码：

   const site = "vinkm.com";

2. 也可以包含强调：

   先保证正确，再考虑优化。

3. 长链接应正常换行：

   https://developers.cloudflare.com/workers/runtime-apis/bindings/

安全说明

文章中的原始 HTML 会被转义，而不是直接执行。这样可以避免通过 Markdown 注入脚本，是有意保留的安全边界。

结尾

如果你能清楚看到标题层级、列表缩进、任务复选框、代码语言标签、表格、图片、引用和分隔线，那么这套 Markdown 渲染样式已经通过基础验证。

感谢阅读。返回 首页 查看更多内容。