HTML+CSS 生成的 .pdf 文件在不同的计算机上有不同的布局？

Question

我设法使用 HTML 和 CSS 生成了一个 .pdf 文件。 页面大小以英寸为单位预定义(A4 格式)。它在我的电脑上运行良好，但是当我在另一台电脑上运行该程序时，生成的文件看起来不同，页面仍然是 A4，但布局发生了变化，尽管两台电脑具有相同的分辨率和 dpi。

Answer 1

使用 CSS 维护两者的设计。

@media print - 用于打印机

@media screen - 适用于电脑屏幕、平板电脑、智能手机等

@media print{
   h1{
      color:red;
   }
}


@media screen{
   h1{
      color:blue;
   }
}

<h1>Hello</h1>

在代码段屏幕中单击“结果”，然后按“CTRL + P”。