打印收据CSS

Question

I am having an issue that I have installed BIXOLON printer and want to print a receipt through it. 我有一个问题，我已经安装了BIXOLON打印机，并想通过它打印收据。 Have used java script to print it but printing page size is too large. 使用了Java脚本来打印它，但是打印页面尺寸太大。

inner Html: 内部HTML：

<div id="divToPrint" class="invoice p-3 mb-3" style="max-height:100%">


<div class="row">
    <div class="col-12">
      <h4 style="text-align:center">
        <img src="<?php echo base_url()?>assets/dist/img/AdminLTELogo.png" class="img-responsive" style="max-width:100px;margin:0 auto;display:block"> 
        <br>
      </h4>
    </div>
  </div>
  <div class="row invoice-info">
    <div class="col-sm-4 invoice-col">
    </div>
    <div class="col-sm-4 invoice-col">
    </div>
    <div class="col-sm-4 invoice-col">
      <b>Invoice #<?php echo date('M Y').'-'.$id?></b><br>
      <br>
      <b>Payment:</b> <?php $amount?><br>
      <b>Duration:</b> <?php echo $duration ?>
    </div>
  </div>
  <div class="row">
    <div class="col-12 table-responsive">
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Qty</th>
            <th>Station</th>
            <th>Serial</th>
            <th>Total</th>
          </tr>
        </thead>
        <tbody>        
          <tr>
            <td>1</td>
            <td><?php echo $stationTitle; ?> </td>
           <td><?php echo$ id?></td>
           <td><?php echo $amount?></td>
         </tr>
       </tbody>
     </table>
   </div>
 </div>
 <div class="row">
  <div class="col-6">
  </div>
  <div class="col-6">
    <p class="lead">Date <?php echo date('d M Y')?></p>
    <div class="table-responsive">
      <table class="table">
        <tr>
          <th style="width:50%">Total:</th>
          <td><?php $amount?></td>
        </tr>
      </table>
    </div>
  </div>
</div>
</div>

Here is my java script code: 这是我的Java脚本代码：

function PrintDiv() {    
   var divToPrint = document.getElementById('divToPrint');
   var popupWin = window.open('', '_blank', 'width=400,height=300');
   popupWin.document.open();
   popupWin.document.write('<html><body style="width: 58mm " onload="window.print()">' + divToPrint.innerHTML + '</html>');
    popupWin.document.close();
}

Have attached an image with it too. 也附带了图像。 Want to print a short receipt to limited height. 想要打印一张短的收据以限制高度。

Thank You. 谢谢。

Answer 1

It's hard to tell, bcs you haven't provide the inner div html and styles. 很难说，BCS还没有提供内部div html和样式。

However, try this: 但是，请尝试以下操作：

<body style="width: 58mm; height: 120mm; overflow: hidden;" onload="window.print()">

打印收据CSS

问题描述

1 个解决方案

解决方案1
0 2018-08-02 11:40:09

打印收据CSS

问题描述

1 个解决方案

解决方案1 0 2018-08-02 11:40:09

解决方案1
0 2018-08-02 11:40:09