返回 Activity

Markdown 渲染能力测试

覆盖 Markdown / GFM / 安全 HTML 子集的测试页面，用于验证弹窗渲染效果。

AI 摘要 · AI Overview

这条动态记录了主力年份 + 当前日期的测试动态，用于验证弹窗对 Markdown、GFM 和安全 HTML 子集的渲染能力。

Markdown测试文档网络设计自定义蓝unknown:非法颜色普通标签
Markdown 测试

这是主力年份 + 当前日期的测试动态，用来验证 /activity/ 弹窗对 Markdown、GFM 和安全 HTML 子集的渲染能力。

这段长文本用于测试普通段落的阅读节奏：一篇技术笔记里常常会混合普通文字、inline code、站内链接 和 外部链接。如果行高、段距和链接样式都合适，读起来应该稳定、清楚，并且不会像默认浏览器样式那样拥挤。

/images/activity/obs-repair.svg

标题层级

一级标题：弹窗里也应该可控

二级标题：章节分隔

三级标题：小节说明

四级标题：补充信息

文本样式

  • 粗体文本 Bold
  • 斜体文本 Italic
  • 粗斜体 Bold Italic
  • 删除线 Strikethrough
  • 行内代码 Inline Code
  • 上标：E = mc2
  • 下标：H2O
  • 键盘：Ctrl + K，或 ⌘ + Enter

脚注测试：这句话后面有一个脚注引用。1

列表

无序列表

  • 第一项：普通项目
  • 第二项：有嵌套内容
    • 嵌套子项 A
    • 嵌套子项 B
      • 更深一层，用于观察缩进是否过大
  • 第三项：最后一个项目

有序列表

  1. 准备测试内容
  2. 打开 Activity 弹窗
    1. 检查滚动区域
    2. 检查弹窗关闭按钮
    3. 检查 Markdown 样式
  3. 记录问题并继续调整

任务列表

  • 粗体、斜体、删除线
  • 表格和任务列表
  • 安全 HTML：sup、sub、kbd、details
  • 未来如果需要再接入代码高亮
  • 未来如果需要再接入数学公式

引用

这是一段引用文字。Markdown 的引用可以包含其他格式，比如 inline code 和 链接。

—— 测试用引用来源

嵌套引用第一层

第二层引用：用于测试层级缩进

第三层引用：不应该把布局撑坏

代码块

interface MarkdownTest {
  heading: boolean;
  code: boolean;
  table: boolean;
  safeHtml: boolean;
}

function renderAll(): MarkdownTest {
  return {
    heading: true,
    code: true,
    table: true,
    safeHtml: true,
  };
}
def fibonacci(n: int) -> list[int]:
    a, b = 0, 1
    result = []
    for _ in range(n):
        result.append(a)
        a, b = b, a + b
    return result
cat /var/log/nginx/access.log \
  | grep " 404 " \
  | awk '{print $1}' \
  | sort | uniq -c | sort -rn \
  | head -20
这是一个超长单行代码块测试：aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

表格

特性支持情况备注
标题✅h1-h4 都应被弹窗样式约束
粗体✅**text**
斜体✅*text*
删除线✅GFM
代码块✅保留语言 class，样式不撑破弹窗
表格✅小屏横向滚动
任务列表✅checkbox 对齐
安全 HTML✅sup/sub/kbd/details
数学公式暂不支持后续可加 KaTeX/remark-math

长表格横向滚动测试

日期事件分类状态很长很长的备注字段，用来确认表格不会撑破弹窗布局
2026-06-13Markdown 渲染测试文档进行中这一列故意很长，移动端应该出现横向滚动，而不是让弹窗变宽或者内容溢出。
2026-06-12MCP Server 搭建开发完成表格内容里也可以包含 inline code 和普通文本。
2025-12-01Ubuntu 初始化DevOps完成验证跨年份数据筛选时，这条记录不会影响 Markdown 弹窗样式。

链接与图片

Astro Logo

Details 折叠区域

点击展开渲染说明

这里是被折叠的内容，可以包含普通 Markdown、inline code 和列表：

  • 折叠内容 1
  • 折叠内容 2
  • 折叠内容 3

转义字符

* 这不是斜体 *

` 这不是代码 `

# 这不是标题

以上内容覆盖了 Markdown / GFM / 安全 HTML 子集的主要渲染特性。

Footnotes

  1. 这里是脚注内容，用于验证 GFM footnote 的输出结构和样式。 ↩