打印 Bootstrap 4 网页时出现字体问题

Question

我使用 Bootstrap 4 构建了一个页面。我想将此页面打印为 PDF，并且我希望它完全按照它的外观打印。我使用谷歌浏览器作为浏览器。

Chrome 的打印预览可以正确显示页面，但问题是，当我在保存后打开文件时，我看到字体有问题，例如字母“L”变粗。然后我将字体更改为 Times new roman。它修复了 Ls，但这次其他一些字符是粗体的。为了确认这一点，我尝试打印 Bootstrap 的主页，也出现了同样的问题。

这是 Chrome 中的主页：https://ibb.co/XScJYph

Chrome 打印预览：https://ibb.co/jG3hWmm

这是保存为 PDF 后的样子：https://ibb.co/MNBkRtY

如何克服它并保持一致性？请注意，我尝试了 Times new roman、Arial 和 Helvetica 字体。他们都有问题，没有一个工作完美。

除了这一行之外，我没有使用任何 CSS：@media print {body {width: 8.5in;height: 11in;}}，这应该不是问题。

提前谢谢你。

Answer 1

我猜这个问题取决于你的电脑字体。我的意思是当我检查相同的情况时，我没有问题。

您可以检查阅读器字体，也可以在 chrome 上打开该 .pdf 文件。