HTML to PPTX

HTML 转可编辑 PowerPoint 演示引擎

测试夹具 · 10页演示

1 / 10

纯文字排版

大号文字 — 28px,适合标题性内容

中号文字 — 22px,主体段落常用字号

小号文字 — 16px,注释、引用、次要信息

CSS 可以通过 font-size 精确控制各级文字大小,

在 PPTX 转换时这些样式应当被保留为对应的字号。

2 / 10

内容结构

一、项目背景

将 HTML 内容转换为 PowerPoint 演示文稿,保留富文本样式。

二、核心功能

三、技术选型

Playwright + pptxgenjs 组合方案

3 / 10

多彩文字

红色文字 — 醒目提示

绿色文字 — 通过 / 成功

蓝色文字 — 链接 / 信息

橙色文字 — 警告 / 注意

紫色文字 — 特殊标注

4 / 10

字形混排

这段话全部是粗体(font-weight: bold)

这段话全部是斜体(font-style: italic)

这段话既粗体又斜体

普通文字中混入 粗体 斜体 片段

同时 粗斜体 粗体 混合呈现

5 / 10

文本对齐

左对齐

这是左对齐的段落文字,适合大段正文阅读,符合大多数语言的阅读习惯。

居中

这是居中对齐的段落文字,常用于标题、引言或强调性内容。

右对齐

这是右对齐的段落文字,常用于落款、日期或装饰性文字。

6 / 10

深色背景

白色文字在深蓝背景上呈现

高反色对比确保可读性

强调色使用黄色 (#ffd54f)

这种配色适用于晚间演示或科技感主题

转换引擎需要正确处理前景色与背景色关系

7 / 10

长文阅读

HTML to PPTX 转换引擎的设计目标是让用户能够从熟悉的 Web 内容出发,快速生成可编辑的 PowerPoint 演示文稿。核心技术路线是利用 Playwright 渲染 DOM 树,提取每个元素的样式和几何信息,再通过 pptxgenjs 在 PPTX 文件中重建相应的文本块和形状。

样式映射是转换的核心挑战。CSS 中的 font-size、font-weight、font-style、color、text-align、background-color 等属性需要在 PPTX 的 XML 格式中找到对应表现。本项目目前采用按页截取的方式保留结构和样式信息。

测试夹具覆盖了常见的排版场景:不同字号、颜色、字形、对齐方式和背景色。后续还将增加表格、图片、列表嵌套等复杂场景的测试用例,确保转换引擎覆盖实际使用中的各类需求。

8 / 10

字体族展示

衬线字体 — Serif(如 Times New Roman)

无衬线字体 — Sans-serif(如 Arial)

等宽字体 — Monospace(如 Courier New)

手写体 — Cursive(如 Comic Sans)

Georgia 衬线字体示例文字

9 / 10

感谢阅读

10页测试夹具已完成

HTML to PPTX · Test Fixture

10 / 10