时间戳

首页 > 解决方案 > 打印贴纸之间的空白页 HTML CSS

html - 打印贴纸之间的空白页 HTML CSS

问题描述

我在使用 TSC DA210 打印机打印不干胶标签到餐厅菜单订单时遇到此问题，不干胶标签尺寸为 102 毫米 x 24 毫米。

问题是它在每个正确的标签后打印 4 个空白贴纸，我尝试将标签尺寸调整为小于实际贴纸尺寸，但它仍然在打印之间继续打印 4 个空白贴纸。

这就是它的打印方式。

在此处输入图像描述

这是我的html代码。

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Printing Order</title>
    <style>
    *{box-sizing:border-box;}
    @media print {
        .pagebreak { page-break-after: always; } /* page-break-after works, as well */
         html, body {
                height: 99%;    
            }
    }
    body{
        width:100%;
        padding:0;
        font-size:11px;
        line-height:20px;
        margin:0px;
    }
    .label{
        padding:0;
        height:80px;
        width:98%;
        margin:0 auto;
        page-break-after: always;

    }
    .lc{display: flex;justify-content: center;align-items: center; flex-direction: column;}
    .off{color:#636060;}
    .fss{font-size:10px;}
    .flr{float:right;}
    .tc{text-align:center;}
    .fs14{font-size:14px; font-weight:800;}
    </style>
</head>
<body>
    <div class="label"><div style="padding:10px 15px;">
        <div class="fss off">Le plus vite possibl <span class="flr">04/23/2021 09:15 pm</span></div>
        <b>Somename</b>, 0484000000<br>
        Address NA, NA 6010</div>
    </div>
    <div class="label lc tc fs14">
        <div style="padding:10px 15px;">Veg Cutlets</div>
    </div><div class="pagebreak"></div>
    <div class="label lc tc fs14">
        <div style="padding:10px 15px;">Chapatti</div>
    </div><div class="pagebreak"></div>
    <div class="label lc tc fs14">
        <div style="padding:10px 15px;">Chapatti</div>
    </div><div class="pagebreak"></div>
</body>
</html>

标签： htmlcssprinting

解决方案

打印机布局更关注打印机设置。您的系统中应安装驱动程序的更新版本。您可以在普通打印机上检查您的 HTML 页面布局并使用不同的尺寸进行测试。

如果这不起作用，您可以"%"在 HTML 页面上定义您的尺寸。

推荐阅读