Vue.js - 如何打印自定义尺寸的网页? [英] Vue.js - How can I print a web page with custom sizes?

问题描述

我有一个 HTML 发票模板，我想用自定义尺寸(如 80 毫米和 297 毫米)打印此模板(整页).我试过这段代码:

I have an HTML invoice template and I want to print this template (WHOLE PAGE) with custom sizes like 80mm and 297mm. I tried this code:

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

但它不起作用.如何打印具有自定义尺寸的页面?

but it's not working. How can I print a page with custom sizes?

推荐答案

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.
}

这篇关于Vue.js - 如何打印自定义尺寸的网页?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！