Javascript Vue.js-如何打印具有自定义大小的网页？

我有一个HTML发票模板，我想打印这个模板（整个页面）与自定义大小，如80mm和297mm。我尝试了以下代码：

@media print {
    @page {
      size: 80mm 297mm;
      margin: 0;
    }
}

---

但它不起作用。如何打印自定义大小的页面？

您可以使用此JS函数以给定大小打印内容，您可以通过触发事件调用此函数

函数打印（）{
var yourDOCTYPE=“”；
var printPreview=window.open（“”，“打印预览”）；
var printDocument=printPreview.document；
printDocument.open（）；
可变磁头=
"" +
“.打印{高度：279毫米；宽度：80毫米；}”+
"";
printDocument.write（您的文档类型+
"" +
头+
"" +
"" +
""+
""+
"" +
"");
printPreview.print（）；
printPreview.close（）
}

您可以使用这个JS函数来打印给定大小的内容，您可以通过触发事件来调用这个函数

函数打印（）{
var yourDOCTYPE=“”；
var printPreview=window.open（“”，“打印预览”）；
var printDocument=printPreview.document；
printDocument.open（）；
可变磁头=
"" +
“.打印{高度：279毫米；宽度：80毫米；}”+
"";
printDocument.write（您的文档类型+
"" +
头+
"" +
"" +
""+
""+
"" +
"");
printPreview.print（）；
printPreview.close（）
}

CSS解决方案：

.printableArea {
    width: 8.5cm; // !important
    height:100%; // !important
}
 
@page {
    size: 8cm auto; // 
    width: 8cm; //
    height: 100%; //
    margin: 0;
    margin-left: 5px !important; // this is for me.
}

CSS解决方案：

.printableArea {
    width: 8.5cm; // !important
    height:100%; // !important
}
 
@page {
    size: 8cm auto; // 
    width: 8cm; //
    height: 100%; //
    margin: 0;
    margin-left: 5px !important; // this is for me.
}

---

您到底想打印什么？表格还是其他东西？表格。但是我不认为重要的是你能提供一些代码来更清楚吗？兄弟，我不认为你明白。我有一个html发票模板。认为一个页面唯一的内容就是一个表。我想打印整页，我同意。但我的问题是纸张大小。我想用发票打印机打印此页，此发票打印机的尺寸为8.5cm宽X自动高度。当我打印页面时，它会显示全幅a4大小的内容。您到底想打印什么？表格还是其他东西？表格。但是我不认为重要的是你能提供一些代码来更清楚吗？兄弟，我不认为你明白。我有一个html发票模板。认为一个页面唯一的内容就是一个表。我想打印整页，我同意。但我的问题是纸张大小。我想用发票打印机打印此页，此发票打印机的尺寸为8.5cm宽X自动高度。当我打印页面时，它会显示全宽a4大小的内容