gpt4 book ai didi

reactjs - ElectronJS打印HTML文档的高度问题

转载 作者:行者123 更新时间:2023-12-03 12:22:56 24 4
gpt4 key购买 nike

我正在研究 ElectronJS Reactjs 项目,以构建一个使用热敏打印机打印文档(作为Web HTML格式)的应用程序。

热敏打印机在宽度为50mm或80mm但没有高度限制的特殊纸张上打印文档。

我使用Reactjs生成HTML Contents和CSS3打印媒体样式以隐藏屏幕内容#root并仅显示我想要打印的#print

@media only print {
@page {
size: auto; /* auto is the initial value */
margin: 0; /* this affects the margin in the printer settings */
height: auto !important;
width: 70mm !important;
}

html, body {
margin: 0 !important;
padding: 0 !important;
position: fixed;
left: 0;
top: 0;
background: #eee !important;
font-family: 'Tahoma', 'Segoe UI Light', 'Segoe UI', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Verdana, sans-serif !important;
visibility: hidden;
height: auto !important;
width: 70mm !important;
overflow: visible !important;
}

#root {
display: none !important;
visibility: hidden !important;
}

#print {
display: block;
position: fixed;
left: 0;
top: 0;
visibility: initial !important;
padding: 1px !important;
background: white;
border: none;
outline: none;
margin-left: 5mm;
height: auto !important;
width: 70mm !important;
overflow: visible !important;
}
}

问题是当我尝试打印长页面时,它仅打印其上部。我发现这与屏幕高度某种程度上与 有关。因为它打印的是与我显示打印范围时显示的部分完全相同的部分,所以它忽略了文档的可滚动部分。
webContents.print({ silent: true, printBackground: false, printerName },() => {});

我认为我的问题与这个one非常接近。

任何想法都会有所帮助,

最佳答案

我修好了它。
我只是从position: fixed;html, body中删除#print

关于reactjs - ElectronJS打印HTML文档的高度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54392248/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com