使用window.print()打印Safari

Question

我正在尝试打印我的一个vue-routes。因此，vue-html-to-paper在vue中不能正常工作。使用print.js时，不可能包含本地css文件。

我做了以下基本的css打印:

// global printing
@media print {
@page {
size: A4;
}
// hide buttons and non-content
button,
aside {
display: none !important;
}
// somehow there are no line-break, so border content
div {
max-width: 100vw;
}
// footer
body::after {
content: url("../assets/printfooter.png");
// center
display: flex;
justify-content: center;
}
}

在

上运行得很顺利，很简单

• Firefox 85.0(64位)
Chrome 88.0.4324.96(官方版本)(64位)
• 甚至在我的手机上使用Chrome 88.0.4324.152

尝试在Safari上打印不工作。

• 在桌面版本14.0.2中，有一半的内容越界。
• 在手机iPhone 14.4。

有没有提示我要做什么才能让苹果满意，或者我可以改进什么?

Answer 1

我很确定问题是@page规则，这是不支持我的Safari。看到更多:https://developer.mozilla.org/de/docs/Web/CSS/@page

我最终用pdfkit服务器端创建了pdf。