分类

← View All Tools

HTML转PDF（精确排版）

使用浏览器渲染HTML/CSS生成精确页眉页脚的PDF

此工具使用无头浏览器渲染HTML/CSS，适合高精度排版。

页眉页脚：

支持自定义HTML模板
使用  与  显示页码
可直接写内联样式

打印设置：

A4/Letter/Legal页面大小
边距（毫米）
背景打印与缩放
支持 @page 与 @media print（启用“优先CSS页面尺寸”）

关键信息

分类: Document Tools
输入类型: textarea, select, checkbox, number
输出类型: file
样本覆盖: 4
支持 API: Yes

概览

HTML转PDF（精确排版）工具利用无头浏览器渲染技术，将HTML与CSS内容精准转换为高质量PDF文档，支持自定义页眉页脚、页面边距及打印样式，非常适合生成报表、发票或专业文档。

适用场景

•需要将网页内容或自定义HTML代码转换为高保真PDF文档时。
•需要为文档添加包含自动页码的自定义页眉或页脚时。
•需要通过CSS精确控制打印布局、边距及背景显示时。

工作原理

•输入或粘贴您的HTML代码，并根据需要添加自定义CSS样式。
•在设置面板中选择页面尺寸、边距及缩放比例，并配置页眉页脚模板。
•点击转换按钮，工具将通过无头浏览器渲染页面并生成可下载的PDF文件。

使用场景

将动态生成的财务报表HTML转换为标准A4格式的PDF存档。

为企业内部文档添加带有公司Logo和自动页码的页眉页脚。

将复杂的网页布局通过CSS精确调整后，导出为用于打印的专业手册。

用户案例

1. 生成带页码的财务月报

财务专员

背景原因: 需要将系统导出的HTML格式月报转换为正式的PDF文件，要求包含页码和公司页脚。
解决问题: 普通打印功能无法自动添加页码，且排版容易错乱。
如何使用: 将HTML报表粘贴至输入框，在页脚模板中填入页码代码，并设置20mm边距。
示例配置: pageSize: A4, marginTop: 20, marginBottom: 20, footerTemplate: '<div style="font-size:10px; text-align:center;">第 页 / 共 页</div>'
效果: 生成了一份排版整齐、带有自动页码和统一页脚的专业PDF月报。

2. 打印网页版产品手册

市场经理

背景原因: 需要将网页版产品介绍手册转换为PDF，以便发送给客户。
解决问题: 网页背景色在默认打印下丢失，且页面尺寸不匹配。
如何使用: 上传HTML内容，勾选“打印背景”，并设置“优先CSS页面尺寸”以适配手册的特殊排版。
示例配置: printBackground: true, preferCssPageSize: true, scale: 1.0
效果: PDF完美保留了网页的视觉风格，且页面尺寸完全符合手册设计要求。

用 Samples 测试

html, pdf

PDF示例

2026-02-01 到 2026-02-10 工具生成的PDF示例

title token pdf

pdf

包含图片的HTML示例

包含图片的HTML源代码示例，用于测试提取

title token html

sample

Markdown 幻灯片示例

用于测试 PDF 导出的 Remark/Marp 风格 Markdown 幻灯片

matched family pdf

pdf

代码注释示例

用于测试注释移除的各种注释样式代码示例文件

keywords html,css

sample

常见问题

如何添加自动页码？

在页眉或页脚模板中，使用 `` 表示当前页码，使用 `` 表示总页数。

支持CSS打印样式吗？

支持。您可以直接在CSS区域编写 `@media print` 规则，或勾选“优先CSS页面尺寸”以应用 `@page` 规则。

如何确保背景颜色被打印出来？

请在设置中勾选“打印背景”选项，这样CSS中定义的背景色和背景图片将会被渲染到PDF中。

页面尺寸有哪些选择？

工具支持 A4、Letter、Legal 和 A5 等常用标准页面尺寸。

转换时页面加载不完整怎么办？

您可以调整“等待条件”选项（如设置为 networkidle0），或增加“额外等待时间”以确保页面资源完全加载后再生成PDF。

API 文档

请求端点

POST /zh/api/tools/html-to-pdf-precise

请求参数

参数名	类型	必填	描述
htmlContent	textarea	是	-
cssContent	textarea	否	-
pageSize	select	否	-
landscape	checkbox	否	-
printBackground	checkbox	否	-
scale	number	否	-
marginTop	number	否	-
marginBottom	number	否	-
marginLeft	number	否	-
marginRight	number	否	-
headerTemplate	textarea	否	-
footerTemplate	textarea	否	-
mediaType	select	否	-
waitUntil	select	否	-
waitTime	number	否	-
preferCssPageSize	checkbox	否	-

响应格式

{
  "filePath": "/public/processing/randomid.ext",
  "fileName": "output.ext",
  "contentType": "application/octet-stream",
  "size": 1024,
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}

文件: 文件

AI MCP 文档

将此工具添加到您的 MCP 服务器配置中：

{
  "mcpServers": {
    "elysiatools-html-to-pdf-precise": {
      "name": "html-to-pdf-precise",
      "description": "使用浏览器渲染HTML/CSS生成精确页眉页脚的PDF",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=html-to-pdf-precise",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

你可以串联多个工具，比如：`https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`，最多20个。

如果遇见问题，请联系我们：[email protected]

分类