我正在使用
this library生成条形码,我需要打印包含条形码的页面.
当我启动打印对话框时,虽然占用空间,但我找不到条形码.
$(document).ready(function() { window.print(); });
@media print { .barcode-container { display: block !important; } }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="subpage"> <div class="barcode-container"> <div style="font-size:0;position:relative;width:422px;height:30px;"> <div style="background-color:black;width:4px;height:30px;position:absolute;left:0px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:6px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:16px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:22px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:28px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:36px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:44px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:50px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:56px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:66px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:74px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:82px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:88px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:94px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:100px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:110px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:116px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:124px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:132px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:138px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:146px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:154px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:160px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:168px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:176px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:182px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:190px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:198px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:204px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:212px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:220px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:226px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:234px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:242px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:248px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:256px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:264px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:272px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:280px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:286px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:292px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:300px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:308px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:314px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:324px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:330px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:336px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:344px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:352px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:358px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:368px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:374px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:382px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:390px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:396px;top:0px;"> </div> <div style="background-color:black;width:6px;height:30px;position:absolute;left:406px;top:0px;"> </div> <div style="background-color:black;width:2px;height:30px;position:absolute;left:414px;top:0px;"> </div> <div style="background-color:black;width:4px;height:30px;position:absolute;left:418px;top:0px;"> </div> <div style="background-color:black;width:0px;height:30px;position:absolute;left:422px;top:0px;"> </div> <div style="background-color:black;width:0px;height:30px;position:absolute;left:422px;top:0px;"> </div> </div> </div> <p class="bold">ID: 60105</p> <p>Lorem ipsum dolor sit amet,consectetur adipiscing elit. Phasellus luctus volutpat lorem a auctor. In lorem nisi,vulputate vel dapibus eu,tristique non lacus. Proin maximus nulla a imperdiet accumsan. Nullam diam tortor,hendrerit a libero vel,placerat ullamcorper urna. Vivamus consequat placerat lectus,mattis porttitor felis feugiat non. Quisque non elementum est. Quisque semper tincidunt nunc quis condimentum. Morbi tristique ipsum quis velit accumsan tincidunt. Etiam et imperdiet ex,at posuere enim. Curabitur vitae lacinia libero.</p> </div>
我试着做一个显示:阻止!重要;到条形码容器但它仍然没有打印它.有任何想法吗?