css 镀 chrome 印刷精确测量

hts6caw3  于 2023-01-18  发布在  其他
关注(0)|答案(1)|浏览(129)

我已经创建了一个页面,我想用chrome浏览器打印。一切似乎都很好。但是,打印的边框与我提供的尺寸不完全一致。请参考下面的图片。
它在我的屏幕上的样子:

镀 chrome 打印的内容:

请注意左侧线条宽度的差异。
我如何强制chrome精确地打印屏幕上的内容?尤其是边框测量。
以前打印背景色时遇到困难:但是,我使用了:

-webkit-print-color-adjust: exact !important;

现在打印黑色背景。对于边框有类似的解决方案吗?

mcvgt66p

mcvgt66p1#

您好,我刚刚遇到了同样的错误,并找到了解决方案!
在我的代码中,我将打印缩放设置为50%,这会导致边框的1 px倍大,为了解决这个问题,我刚刚删除了50%的语句,如果你没有改变你的缩放比例,如果你将缩放设置为200%,它会工作。
这是我的代码(scss):

@media print {
  body {
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    //zoom: 50%;
  }

  .no-print {
    display: none !important;
  }
}

相关问题