2017-10-03 5 views
0

2ページを超える請求書を印刷しようとしていますが、印刷中にページ番号を下部に表示します。 Firefoxではうまく動作しますが、クロムはすべてのページで1ページだけを印刷します。ページ番号を印刷する別の方法がありますか?私はたくさんの解決策を試しましたが、これはクロムやIEでは機能しません。最新のクロムブラウザで最新版のクロムブラウザで印刷することができません

@charset "utf-8"; 
 
/* CSS Document */ 
 

 
@page { 
 
    size:8.27in 11.69in; 
 
    margin: 0.5cm; 
 
} 
 

 

 

 
body { font-family:"Courier New", Courier, monospace; line-height: 1.5; 
 
\t font-size: 11pt; } 
 
.header { position:fixed; top:0; text-align:center; width:100%; margin: 0 auto; height:100px; bottom:1em; } 
 

 
.page-layout { 
 
     page-break-after: always; position: relative; 
 
    width: 100%; 
 
    top:2em; //match size of header 
 
    left:0px; 
 
    right:0px;  
 
    }   
 
.footer { position:fixed; bottom:0; text-align:center; width:100%; margin:0 auto; } 
 
.footer:after { width:100%; margin:0 auto; text-align:center; 
 
    counter-increment: page; 
 
    content:"Page " counter(page); 
 
} \t 
 
.inv-details { } 
 
.tstripe { border-top:2px dashed #000;} 
 
table { 
 
\t page-break-inside: avoid; 
 
}
<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
 
<title>Invoice</title> 
 
<link rel="stylesheet" type="text/css" media="print" href="css/print.css" /> 
 
</head> 
 

 
<body> 
 

 
<div class="header">Commercial Invoice</div> 
 
<div class="page-layout"> 
 
<div class="footer"></div> 
 
<table class="inv-details" width="100%"> 
 
\t <tr> 
 
    \t <td>Invoice Number</td> 
 
     <td>Purpose of Shipment</td> 
 
     <td>Curr <br /> USD</td> 
 
     <td>Ult Dest. <br /> US </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td>Export Dt <br /> 8/14/2017 </td> 
 
     <td>C.I. References </td> 
 
     <td>Pkgs <br /> 1 <br /> OTH </td> 
 
     <td>Bill T/C <br /> 1378-4267-0 </td> 
 
     </tr> 
 
</table> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td width="50%">Shipper: <br /> 
 
     VENNY PERSAUD <br /> 
 
     SBC INC, <br /> 
 
     130 MATHESON BLVD, E, <br /> 
 
     UNIT 1</td> 
 
     <td width="50%">Consignee: <br /> 
 
     Marlon Browder <br /> 
 
     Marlon Browder <br /> 
 
     320 E GILLESPIE ST 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     \t <td width="50%">MISSISSAUGE <br /> 
 
     ON L4Z1Y6 CA (866) 330-1272 <br /> 
 
     ID/EIN: </td> 
 
     <td width="50%">STARKVILLE <br /> 
 
     MS 39759 US (622) 617-9890 <br /> 
 
     ID/EIN: 
 
     </td> 
 
     </tr> 
 
</table> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td valign="top" width="50%"> 
 
     \t Broker <br /> 
 
      FedEx Ground's Broker 
 
     </td> 
 
     <td> 
 
     \t Importer <br /> 
 
      VENNY PERSAUD <br /> 
 
      SBC INC, <br /> 
 
      130 MATHESON BLVD, E, <br /> 
 
      UNIT 1 <br /> 
 
      MISSISSAUGA <br /> 
 
      ON L4Z1Y6 CA (866) 330 - 1272 <br /> 
 
      ID/EIN: <br /> 
 
     </td> 
 
    </tr> 
 
</table> 
 
<!-- Item 1 --> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Latex Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 
<!-- Item 2 --> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 

 

 
<!-- Total --> 
 
<table class="tstripe" width="100%" style="margin-top:30px;"> 
 
\t <tr> 
 
    \t <td align="right">Total Shipment Weight::</td> 
 
     <td>1</td> 
 
     <td align="right">Total Commodity </td> 
 
     <td align="right">29.12</td> 
 
    </tr> 
 
    <tr> 
 
     \t <td align="right" colspan="3">Terms of Sale:</td> 
 
     <td align="right">FCA</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Freight:</td> 
 
     <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Insurance:</td> 
 
     <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Others:</td> 
 
\t \t <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Total Invoice Value:</td> 
 
     <td align="right">29.12</td> 
 
     </tr> \t \t \t  \t 
 
</table> 
 

 
<table> 
 
<tr><td> \t Comments</td></tr> 
 
<tr><td>1) </td></tr> 
 
<tr><td>2) </td></tr> 
 
<tr><td>3) </td></tr> 
 
<tr> 
 
\t <td>Tracking Numbers: 738443302589 </td> 
 
</tr> 
 
<tr> 
 
\t <td>I declare all information in this invoice to be true and correct. </td> 
 
    </tr> 
 
    <tr> 
 
\t <td>Signature of shipper: VENNY PERSAUD <span style="float:right;">8/14/2017</span></td> 
 
</tr> 
 
</table> 
 
</div> 
 
</body> 
 
</html>

答えて

0

を助けてください、私は何とかjqueryのを使用してクロームでこれを行う方法を発見しました。

var bottom = 0; 
 
$(document).ready(function() { 
 
    $("table:nth-child(9n)").each(function() { 
 
    bottom -= 5; 
 
    botString = bottom.toString(); 
 
    var $counter = $('.footer.first').clone().removeClass('first'); 
 
    $counter.css("bottom", botString + "vh"); 
 
    ($counter).insertBefore('.insert'); 
 
    }); 
 
});
@charset "utf-8"; 
 
/* CSS Document */ 
 

 
@page { 
 
    size:8.27in 11.69in; 
 
    margin: 0.5cm; 
 
} 
 

 

 

 
body { font-family:"Courier New", Courier, monospace; line-height: 1.5; 
 
\t font-size: 11pt; } 
 
.header { position:fixed; top:0; text-align:center; width:100%; margin: 0 auto; height:100px; bottom:1em; } 
 

 
.page-layout { 
 
     page-break-after: always; position: relative; 
 
    width: 100%; 
 
    top:2em; //match size of header 
 
    left:0px; 
 
    right:0px;  
 
     
 
    }  
 
    body { counter-reset: page; }  
 
.footer {text-align:center; width:100%; margin:0 auto; position: absolute; } 
 
.footer::after { top: 95vh; position: relative; 
 
    white-space: nowrap; 
 
    z-index: 20px; width:100%; margin:0 auto; text-align:center; 
 
    counter-increment: page; 
 
    content:"Page " counter(page); 
 
} \t 
 
.inv-details { } 
 
.tstripe { border-top:2px dashed #000;} 
 
table { 
 
\t page-break-inside: avoid; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="footer first"></div> 
 
<div class="insert"></div> 
 
<div class="header">Commercial Invoice</div> 
 
<div class="page-layout"> 
 

 
<table class="inv-details" width="100%"> 
 
\t <tr> 
 
    \t <td>Invoice Number</td> 
 
     <td>Purpose of Shipment</td> 
 
     <td>Curr <br /> USD</td> 
 
     <td>Ult Dest. <br /> US </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td>Export Dt <br /> 8/14/2017 </td> 
 
     <td>C.I. References </td> 
 
     <td>Pkgs <br /> 1 <br /> OTH </td> 
 
     <td>Bill T/C <br /> 1378-4267-0 </td> 
 
     </tr> 
 
</table> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td width="50%">Shipper: <br /> 
 
     VENNY PERSAUD <br /> 
 
     SBC INC, <br /> 
 
     130 MATHESON BLVD, E, <br /> 
 
     UNIT 1</td> 
 
     <td width="50%">Consignee: <br /> 
 
     Marlon Browder <br /> 
 
     Marlon Browder <br /> 
 
     320 E GILLESPIE ST 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     \t <td width="50%">MISSISSAUGE <br /> 
 
     ON L4Z1Y6 CA (866) 330-1272 <br /> 
 
     ID/EIN: </td> 
 
     <td width="50%">STARKVILLE <br /> 
 
     MS 39759 US (622) 617-9890 <br /> 
 
     ID/EIN: 
 
     </td> 
 
     </tr> 
 
</table> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td valign="top" width="50%"> 
 
     \t Broker <br /> 
 
      FedEx Ground's Broker 
 
     </td> 
 
     <td> 
 
     \t Importer <br /> 
 
      VENNY PERSAUD <br /> 
 
      SBC INC, <br /> 
 
      130 MATHESON BLVD, E, <br /> 
 
      UNIT 1 <br /> 
 
      MISSISSAUGA <br /> 
 
      ON L4Z1Y6 CA (866) 330 - 1272 <br /> 
 
      ID/EIN: <br /> 
 
     </td> 
 
    </tr> 
 
</table> 
 

 

 
<!-- Item 1 --> 
 
<table class="tstripe" width="100%"> 
 
    <tr> 
 
     <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
    <tr> 
 
     <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="4"> 
 
      Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 

 
<!-- Item 2 --> 
 
<table class="tstripe" width="100%"> 
 
\t <tr> 
 
    \t <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
\t <tr> 
 
    \t <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
    \t <td colspan="4"> 
 
     \t Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<!-- Item 3 --> 
 
<table class="tstripe" width="100%"> 
 
    <tr> 
 
     <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
    <tr> 
 
     <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="4"> 
 
      Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<!-- Item 4 --> 
 
<table class="tstripe" width="100%"> 
 
    <tr> 
 
     <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
    <tr> 
 
     <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="4"> 
 
      Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<!-- Item 5 --> 
 
<table class="tstripe" width="100%"> 
 
    <tr> 
 
     <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
    <tr> 
 
     <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="4"> 
 
      Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 

 
<!-- Item 6 --> 
 
<table class="tstripe" width="100%"> 
 
    <tr> 
 
     <td>Part Nbr:</td> 
 
     <td>Marks/Nbrs: </td> 
 
     <td>Cntry MFG: US </td> 
 
     <td> Net Wgt: 0.00 lbs</td> 
 
    </tr> 
 
</table> 
 
<table width="100%"> 
 
    <tr> 
 
     <td>HS Code: 9503.90 </td> 
 
     <td>Unit Qty: 1.00 PCS </td> 
 
     <td>Unit Value: 5.600000</td> 
 
     <td>Commodity Value: 5.60 </td> 
 
    </tr> 
 
    <tr> 
 
     <td colspan="4"> 
 
      Desc: Foil Ballon 
 
     </td> 
 
     </tr> 
 
</table> 
 

 
<!-- Total --> 
 
<table class="tstripe" width="100%" style="margin-top:30px;"> 
 
\t <tr> 
 
    \t <td align="right">Total Shipment Weight::</td> 
 
     <td>1</td> 
 
     <td align="right">Total Commodity </td> 
 
     <td align="right">29.12</td> 
 
    </tr> 
 
    <tr> 
 
     \t <td align="right" colspan="3">Terms of Sale:</td> 
 
     <td align="right">FCA</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Freight:</td> 
 
     <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Insurance:</td> 
 
     <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Others:</td> 
 
\t \t <td align="right">0.00</td> 
 
     </tr> 
 
     <tr> 
 
     \t <td align="right" colspan="3">Total Invoice Value:</td> 
 
     <td align="right">29.12</td> 
 
     </tr> \t \t \t  \t 
 
</table> 
 

 
<table> 
 
<tr><td> \t Comments</td></tr> 
 
<tr><td>1) </td></tr> 
 
<tr><td>2) </td></tr> 
 
<tr><td>3) </td></tr> 
 
<tr> 
 
\t <td>Tracking Numbers: 738443302589 </td> 
 
</tr> 
 
<tr> 
 
\t <td>I declare all information in this invoice to be true and correct. </td> 
 
    </tr> 
 
    <tr> 
 
\t <td>Signature of shipper: VENNY PERSAUD <span style="float:right;">8/14/2017</span></td> 
 
</tr> 
 
</table> 
 
</div>

関連する問題