HTML2PDF转换A0页面打印字体过小，如何调整字体大小？

针对你使用html2pdf（结合html2canvas+jsPDF）导出A0横向PDF时字体过小的问题，可通过以下几种方案解决：

1. 调整HTML基础字体与相对单位 #

A0属于超大幅面（841×1189mm），普通屏幕默认的字体尺寸（如16px）放到A0页面上会显得极小。建议：

• 将HTML根元素的基础字体设为更大值，同时用rem作为其他元素的字体单位，实现整体缩放：

html {
  font-size: 32px; /* 根据需求调整，数值越大字体越大 */
}
body {
  font-size: 1rem; /* 继承根字体大小 */
}
/* 针对标题等元素单独调整 */
h1 {
  font-size: 2.5rem;
}

2. 提高html2canvas的缩放比例 #

html2canvas的scale参数控制渲染分辨率，更高的scale能让内容在大尺寸PDF上更清晰，同时视觉上更大。你当前设为2，可尝试提升到3或4（注意：过高的scale会增加内存占用，可能导致卡顿）：

var opt = {
  margin: 1,
  filename: '1099PdfData.pdf',
  image: {
    type: 'jpeg',
    quality: 0.98
  },
  html2canvas: {
    scale: 3 // 调整为更高值
  },
  jsPDF: {
    unit: 'in',
    format: 'a0', // 注意此处需加引号，否则会被当作变量导致错误
    orientation: 'l'
  }
};

3. 使用打印媒体查询定制导出样式 #

专门为PDF导出（属于打印场景）设置独立的字体样式，不影响页面正常显示：

@media print {
  html {
    font-size: 36px;
  }
  /* 可额外隐藏不需要导出的元素 */
  .non-printable {
    display: none;
  }
}

4. 手动调整jsPDF的内容缩放比例 #

如果上述方案效果不佳，可直接通过jsPDF手动控制内容的缩放比例，让内容在A0页面上放大显示：

// 先通过html2canvas获取页面画布
html2canvas(document.body, { scale: 2 }).then(canvas => {
  const imgData = canvas.toDataURL('image/jpeg', 0.98);
  const pdf = new jsPDF('l', 'in', 'a0');
  const pdfWidth = pdf.internal.pageSize.getWidth();
  const pdfHeight = pdf.internal.pageSize.getHeight();
  // 将画布尺寸转换为英寸（默认96dpi）
  const imgWidth = canvas.width / 96;
  const imgHeight = canvas.height / 96;
  
  // 计算缩放比例，可设置大于1的值实现额外放大
  const scale = Math.max(pdfWidth / imgWidth, pdfHeight / imgHeight) * 1.2;
  
  pdf.addImage(imgData, 'JPEG', 1, 1, imgWidth * scale, imgHeight * scale);
  pdf.save('1099PdfData.pdf');
});

内容的提问来源于stack exchange，提问作者manali varshney