Html 为什么一些边框不能从电子应用程序打印？

在一个Electron应用程序中，我将一个预先加载了CSS的HTML页面加载到

iframe

，然后用JavaScript动态填充它。（所有这些都是从渲染过程中完成的，没有IPC发生。）填充

iframe

后，我尝试使用

iframe.contentWindow.print（）

打印其内容

如下图所示，脚本动态生成

.item

s，每个item可以包含任意数量的

.row

s。每个

.row

在屏幕的两侧包含两段文本，由带点边框的

.separator

分隔

当我在Chrome、Firefox或Safari中加载并打印此HTML时，由

print（）

生成的PDF包含每个虚线边框，看起来与网页中呈现的HTML完全相同（FWIW，通常是“隐藏的

iframe

）使用

高度：1px；宽度：1px；可见性：隐藏；

，但这似乎没有什么区别）

但是，在Electron应用程序中，只有一些

.separator

边框呈现在打印PDF中，而其他边框则完全为空，没有任何边框。每次打印文档时，跳过的

.separator

都是相同的

PDF应如下所示（由Chrome生成）：

但电子版看起来是这样的：

我曾尝试使用其他技术生成虚线（例如自定义的

边框图像

或使用类似于所述的渐变

背景

），但这两种方法都不起作用。我尝试过包括

-webkit print color adjust:exact

和

color adjust:exact

CSS规则，它们同样没有什么区别。将

style

标记设置为

media=“print”

只会引入更多问题，而不会修复边框

如何强制从

iframe.contentWindow

的

print（）

函数生成的PDF包含

iframe

中的每个虚线边框

*{
填充：0；
保证金：0；
}
@媒体印刷品{
.项目{
内部分页符：避免；
}
}
.项目{
填充：0.25英寸；
线高：0.35英寸；
}
.行{
显示器：flex；
证明内容：之间的空间；
}
.标签{
文本对齐：居中
}
.text1{
文本对齐：左对齐；
}
.text2{
文本对齐：右对齐；
}
.分离器{
左边距：1吨；
右边距：1吨；
垂直对齐：底部对齐；
柔性生长：1；
高度：1.5em；
边框底部：1px点黑色；
/*最后两条规则可能是多余的*/
-webkit打印颜色调整：精确！重要；
颜色调整：精确！重要；
}

文本1

文本2

项目标签
文本1

文本2

文本1

文本2

项目标签