Javascript 如何使用DYMO打印机打印下面的HTML页面？_Javascript_Jquery_Printing_Dymo

Javascript 如何使用DYMO打印机打印下面的HTML页面？

javascript jquery printing

Javascript 如何使用DYMO打印机打印下面的HTML页面？,javascript,jquery,printing,dymo,Javascript,Jquery,Printing,Dymo,如何使用DYMO打印机打印下面的HTML文件。下面是示例HTML文件。但实际上，我会给ID赋值，点击按钮，我会从DYMO打印机打印标签或贴纸。我将使用JS函数处理这个问题下面我分享了我的HTML和样式表 HTML页面 <html> <head> <title>Print Sticker</title> <link href="stylesheet/bootstrap.min.css" type="text/cs

如何使用DYMO打印机打印下面的HTML文件。下面是示例HTML文件。但实际上，我会给ID赋值，点击按钮，我会从DYMO打印机打印标签或贴纸。我将使用JS函数处理这个问题

下面我分享了我的HTML和样式表

HTML页面

<html>
<head>
<title>Print Sticker</title>
<link href="stylesheet/bootstrap.min.css" type="text/css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
    .margincss {
        margin-top: 5%;
        margin-left: auto;
        margin-right: auto;
    }

    .padTB {
        padding-top: 2%;
        padding-bottom: 2%;
    }

    .hr-text {
        line-height: 1em;
        position: relative;
        outline: 0;
        border: 0;
        color: black;
        text-align: left;
        height: 1.5em;
        /*opacity: .5;*/
    }

    .hr-text:before {
        content: '';
        background: linear-gradient(to right, black, black, black);
        position: absolute;
        left: 15%;
        top: 75%;
        width: 100%;
        height: 1px;
    }

    .hr-text:after {
        content: attr(data-content);
        position: relative;
        display: inline-block;
        color: black;
        padding: 0 .5em;
        line-height: 1.5em;
        color: black;
        background-color: none;
    }

    @page {
        size: A4;
        margin-top: 0.45in;
        width: 100%;
        height: 100%;
        zoom: 1;
    }

    @media print {
        .page {
            margin: 0;
            border: initial;
            border-radius: initial;
            width: initial;
            min-height: initial;
            box-shadow: initial;
            background: initial;
            page-break-after: always;
        }
    }
</style>
</head>

<body>
<div id="pnl1">

    <div class="row padTB">
        <div class="col-md-12">
            <div style="width:35%;" class="col-md-6 col-sm-6 col-xs-6">
                <b>Ship to NY </b><br />
                Supplier Name : <span id="NYClientname">Clay CORPORATION PVT LTD</span><br />
                Invoice Number : <span id="NYInvoiceNo">CON-10-21</span><br />
                No. Of packs : <span id="NYNoOfstones">0</span><br />
                Date : <span id="NYMemoDate"> 09-09-2020</span>
            </div>
        </div>
    </div>

    <div class="row padTB">
        <div class="col-md-12">
            <div style="width:35%;" class="col-md-6 col-sm-6 col-xs-6">
                <b>Ship to Akron </b><br />
                Supplier Name : <span id="AkronClientname">Clay CORPORATION PVT LTD</span><br />
                Invoice Number : <span id="AkronInvoiceNo">CON-10-21</span><br />
                No. Of packs : <span id="AkronNoOfstones">1</span><br />
                Date : <span id="AkronMemoDate">09-09-2020</span>
            </div>
        </div>
    </div>

</div>
</body>

</html>


印刷贴纸
马金格斯先生{
利润率最高：5%；
左边距：自动；
右边距：自动；
}
.padTB{
垫面：2%；
垫底：2%；
}
.hr文本{
线高：1米；
位置：相对位置；
大纲：0；
边界：0；
颜色：黑色；
文本对齐：左对齐；
高度：1.5em；
/*不透明度：.5*/
}
.hr文本：之前{
内容：''；
背景：线性渐变（向右，黑色，黑色，黑色）；
位置：绝对位置；
左：15%；
最高：75%；
宽度：100%；
高度：1px；
}
.hr文本：之后{
内容：attr（数据内容）；
位置：相对位置；
显示：内联块；
颜色：黑色；
填充：0.5em；
线高：1.5em；
颜色：黑色；
背景色：无；
}
@页面{
尺寸：A4；
边缘顶部：0.45英寸；
宽度：100%；
身高：100%；
缩放：1；
}
@媒体印刷品{
.第页{
保证金：0；
边界：首字母；
边界半径：初始；
宽度：首字母；
最小高度：初始高度；
盒影：首字母；
背景：初始；
分页符后：始终；
}
}
发货至纽约

供应商名称：克莱公司私人有限公司

发票号码：CON-10-21

包装数量：0

日期：2020年9月9日
运送至阿克伦

供应商名称：克莱公司私人有限公司

发票号码：CON-10-21

包装数量：1个

日期：2020年9月9日

任何形式的帮助都将不胜感激。

除非他们以某种方式评论、编辑或参与了您的问题，否则您不能@notify people。