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

Question

我创建了一个 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

提前致谢。 肉山

Answer 1

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>

Answer 2

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

  <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 字体系列。 （确保有引号。）