如何显示HTML文档的打印预览

Question

我需要显示一些HTML内容，就像浏览器的打印预览功能一样。但我不确定如何仅使用HTML/CSS/JavaScript实现此功能。目前唯一想到的解决方法是将HTML转换为PDF，然后将该PDF转换为图像并逐个打印每个图像。

如果有更直接的方法，会很有帮助。顺便说一下，我在后端使用PHP，所以如果有相应的PHP类也会很有帮助。

无论用户如何配置，显示页面大小将为信纸大小。

以下是浏览器中应该显示的效果：

- Flupkear

---

你的意思是，不使用浏览器的打印预览功能，而是将打印预览显示为实际的网页内容？ - nonopolarity

Answer 1

我认为这是不可能的。你无法在浏览器（JavaScript）或服务器端（PHP、ASP、Java）中获取所有用户的打印设置。

更新：

请这样考虑（请记住，一个良好的100%稳定的打印预览是不可能的）：

1. 用户导航到页面并要求打印预览。 2. 网站提供打印预览（最好是以HTML格式，否则PNG或PDF）。 3. 用户喜欢并想打印： - 从浏览器 - 从某些图像查看/编辑程序（PNG） - 从Acrobat（PDF） 4. 每个打印解决方案都有自己的打印对话框。您可以在此更改打印设置。 5. 在最后一步中，您无法再控制输出（来自您的网站）...

- Ropstah

---

谢谢，我忘了提到页面大小是信纸尺寸，无论用户配置了什么。 - Flupkear

页面大小只是其中一个问题。打印机的品牌/型号决定了图像的可打印区域，并影响软页断和边距。如果不知道打印机和打印驱动程序的详细信息，就无法可靠地预测它的外观。 - JohnFx

确实，我说的是用户的打印设置，我指的是客户端的打印配置（就像JohnFx所说的那些东西）。 - Ropstah

Answer 2

正如其他人所指出的一样，你无法做到这一点。我的建议是你制作一个“打印友好”版本，只包含纯白背景和纯黑文本。但这大约是你可以接近实际“打印预览”的程度。

- Sasha Chedygov

Answer 3

我认为有一个简单的解决方法。

您可以询问用户页面大小和上下左右边距。然后使用这些设置在PDF中呈现页面。 PDF将保证页面按照生成的方式打印。

我认为这种方法应该很有效。

- Abhijeet Pathak

Answer 4

HTML并不是真正用于页面布局的，它是为在屏幕上阅读而设计的。为什么浏览器的页面预览还不够好呢？

无论如何，你可以尝试将HTML转换为LaTeX或类似的格式，并在服务器端将其呈现为PDF或PNG格式进行显示。但这将排除使用非常复杂的HTML布局，否则会变得非常麻烦。

- whatsisname

---

除非用户获取转换后的PDF或PNG进行打印，否则这将无法为用户提供公平的打印预览。即使如此，它也取决于打印机的外观（您显示了一个无边距打印机，但打印机无法打印无边距...它会压缩到可打印的尺寸，还是会在几页上打印几个部分..？ - Ropstah

当用户想要打印HTML页面时，程序会显示该页面将包含多少页。实际打印时，将使用原始HTML页面，因此边距等设置将由打印机完成。 - Flupkear