html - 打印您看到的网页的最佳方式是什么？

Question

我不确定问题是否如我所说的那样准确，但我想不出更好的方法，所以请耐心等待。

目标:您要在一张W x H 纸上打印浏览器窗口的W x H 区域。

假设:

1. 该页面是静态 HTML 和 CSS。它不会随着时间的推移而改变，您无法与之交互，并且它在每个浏览器中以完全相同的方式呈现。
2. 您使用@media print 和display: none 来确保W x H 之外的所有类都不会出现在打印中。

需要考虑的事项:

1. 指定 W x H(假设它是一个 div)的最佳跨平台方式是什么？鉴于有关纸张大小、DPI、页边距等的相同打印机驱动程序设置，是否有办法使其在打印时显示相同的大小？屏幕的 PPI 重要吗？

2. 字体。打印机可能没有所需的字体。 操作系统 可能没有所需的字体，如果它是网络字体。是否有一种“最佳”打印方式可以让这些通过？有没有一种特定的方法可以使用允许这样做的网络字体？或者有没有办法以打印机的 DPI 光栅化页面并像图像一样打印？

Answer 1

肮脏的做法是截图网页，然后用其他东西打印截图。这样你就可以确保它如你所见。

对于 example

不幸的是，每个浏览器打印机预览都会以不同的方式操作和理解 div，其中大多数只会自动包装内容。解决这个问题的唯一方法是指定固定宽度，例如div 为 1000px，并使用 { overflow-x:auto; 设置样式。溢出-y:隐藏；

有了字体，是的，有一种方法可以在用户的​​计算机上安装字体。另一个简单的解决方案就是制作图片，即 PNG。要安装，请查看 Google Web Fonts(Google 搜索会给您类似的结果)。