Мой пример использования следующий:
У меня есть страница с кнопкой печати. Страница содержит много информации, включая квитанции, как показано ниже. Когда пользователь нажимает «печать», я хочу распечатать только квитанции:
Ниже приведен код моей кнопки печати ниже:
<button type="button" class="btn btn-outline-primary btn-sm" onclick="PrintElem('contentRecu')">
<img src="{{ asset('img/Print.png') }}"/>Imprimer </button>
Ниже мой javascript код для печати:
function PrintElem(elem) {
var prints = '';
if($(".contentRecu").html()!=undefined){
$( ".contentRecu" ).each(function( index ) {
prints += $(this).html() + ' <br><br> ';
});
}
var mywindow = window.open('', 'PRINT', 'height=400,width=600');
mywindow.document.open();
mywindow.document.write('<html><head><title>' + document.title + '</title>');
mywindow.document.write('<link href="http://localhost/bill/public/css/bills_style_pdf.css" rel="stylesheet" media="print" type="text/css"></head><body >');
mywindow.document.write(prints);
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10*/
mywindow.print();
mywindow.close();
return true;
}
Приведенный выше код успешно получает квитанции со страницы, как показано ниже: 
После открытия PDF-файла печатаются только данные квитанции, а не изображение, как показано ниже. почему это так и что я могу сделать, чтобы изображение было напечатано?
Ниже мой css (bills_style_pdf. css ) для изображения
div.wrap {
position: relative;
width: 900px;
height: 560px;
min-width: 900px;
min-height: 560px;
background-image: url("../img/AES_Layout_A5.jpg");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: left top;
visibility: visible;
}