条形码不会出现在打印预览中,但会出现在HTML页面上

时间:2018-01-14 09:41:50

标签: html css barcode-printing

我创建了一个prestashop模块,在该模块中,它从外部API获取空中交通单号码,然后我将这个数字添加到网页上,让用户进行打印。

此条形码仅显示在HTML页面上,但在打印预览对话框中不可见

我将Smarty用于html部分,因为它默认使用Prestashop。

听到我的代码,

<p style="font-family:IDAutomationHC39M;text-align: left">*{$order.other_data.awb}*</p>

知道为什么会这样吗?对此有什么解决方案吗?

更新

{literal}
<style>
table { border-collapse: collapse;font-family:arial;}
td {padding: 8px;}
body { margin: 0;padding: 0;background-color: #FAFAFA;font: 12pt "Tahoma"; }
* {box-sizing: border-box;-moz-box-sizing: border-box; }
.page { width: 21cm;min-height: 29.7cm;padding: 1cm;margin: 0.5cm auto;border: 1px #D3D3D3 solid; border-radius: 5px;
background: white; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); }
.subpage { padding: 0cm;border: 0px black solid;height: 256mm; }

@page { size: A4; margin: 0; }
@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>
{/literal}



{foreach from=$orders_array item=order}        

    <div class="page">
        <div class="subpage">

        <table border="3" style="border-style: solid;width:100%">
            <tr>
                <td> 
                    <table border="0" style="border-style: solid;width:100%">
                        <tr>
                            <td><img src="{$order.other_data.logo}" alt="logo" height="100" width="300"></td>
                            <td>
                                <h3><u>{$order.other_data.service}</u></h3><br>
                                {$order.other_data.ppaddress}
                                <br>www.postaplus.com</td>
                        </tr>
                    </table>

                    <table border="1" style="border-style: solid;width:100%">
                        <tr>
                        <td style="width:40%"><b>From</b></td>
                        <td>
                        <b>{$order.other_data.shipper_name}</b>
                        <br>
                        {$order.other_data.shipper_address},<br>
                        {$order.other_data.shipper_country_code},<br>
                        Phone: {$order.other_data.shipper_phone},
                        </td>
                        </tr>

                        <tr>
                        <td><b>To</b></td>
                        <td>
                        <b>                            
                        </b><br>                            
                        {$order.params.SHIPINFO.Consignee.ToName},<br>                            
                        {$order.params.SHIPINFO.Consignee.ToAddress},                            
                        <br>
                        <b>Phone:</b> {$order.params.SHIPINFO.Consignee.ToMobile} / {$order.params.SHIPINFO.Consignee.ToTelPhone} <br>
                        <b>Civil Id:</b><br>
                        </td>
                        </tr>
                        <tr>

                        <td><b>Pay Type: {$order.params.original_order_array.payment_method}</b></td>
                        <td>Amount: {$order.params.original_order_array.total} - Currency - {$order.params.original_order_array.codcurrency}  </td>
                        </tr>
                        <tr>
                        <td><b>Reference 1</b></td><td>{$order.params.original_order_array.reference} </td></tr>

                        <tr>
                        <td><b>Reference 2</b></td><td></td></tr>

                        <tr>
                        <td><b>Service</b></td><td>{$order.other_data.service}</td>
                        </tr>

                        <tr>
                        <td colspan="2">

                            <table width="100%">
                            <tr>
                            <td><b>Pieces:</b></td> <td>1</td> <td><b>Weight:</b></td> <td>{$order.other_data.total_weight} Kg</td>
                            </tr>
                            </table>
                        </td>
                        </tr>

                        <tr>
                        <td><b>Remarks</b></td>
                        <td></td>
                        </tr>

                        <tr>
                        <td>
                        <b>Note 2</b></td><td>{$order.other_data.original_order_data.notes2}</td></tr>

                        <tr>
                        <td><b>Shipper Order Number:</b></td>
                        <td>                            
                        <p style="font-family:IDAutomationHC39M;text-align: left">*{$order.other_data.awb}*</p>
                        </td>
                        </tr>
                        <tr>
                        <td><b>Shipment Date:</b></td><td>{$order.other_data.awb_date}</td></tr>
                        </table>
                    </td>
                    </tr>
                    </table>
                </td>
            </tr>
        </table>
        </div>
    </div>

{/foreach}

<script>
window.print();
</script>
屏幕截图 html view

print preview

提前致谢。 罗斯汉

2 个答案:

答案 0 :(得分:0)

Roshan以html格式保存以下代码,并检查它是否在您的打印预览中显示条形码。如果它有效,你应该尝试更改你的字体或再次检查你的代码..如果你也在这里上传你的代码将非常有用。还要检查打印预览菜单中的显示背景图形复选框

<!DOCTYPE html>
<html>
<head>
<link href='https://fontlibrary.org/face/idautomationhc39m-code-39-barcode' 
rel='stylesheet'>
<style>
p.serif {
    font-family: 'IDAHC39M Code 39 Barcode', Times, serif;
}

p.sansserif {
    font-family: Arial, Helvetica, sans-serif;
}
</style>
</head>
<body>

<p class="serif">This is a paragraph, shown in the Times New Roman font.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
<p>123456790</p>
<p>ABCDEFGHIJKLMNOPQRSTUVWXYZ</p>
<p>abcdefghijklmnopqrstuvwxyz</p>

</body>
</html>

答案 1 :(得分:0)

在标题中查找字体本身的链接。它应该是这样的:

  <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/idautomationhc39m-code-39-barcode" type="text/css"/>

media="screen"更改为media="screen, print"

我还建议您尝试使用'IDAHC39M Code 39 Barcode'代替IDAutomationHC39M来填充字体系列。 (确保引号在那里。)