我正在使用Dompdf来创建pdf发票并且工作得很好但是我需要将背景图像填满纸张（A4）。我有一个标题，内容和页脚部分，如果我把背景图像放在正文中不起作用。
我的HTML是：
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>Factura XXXX, S.A. con fecha 2017-06-30</title>
<style>
.invoice-header{
max-width:800px;
padding:10px;
font-size:12px;
line-height:15px;
font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
color:#555;
}
.invoice-header table {
border-collapse: collapse;
}
.invoice-header table tr td table tr td {
border:1px solid black;
}
.invoice-header table td{
padding:2px;
vertical-align:top;
}
.invoice-header table tr.heading td{
background:#eee;
font-weight:bold;
}
.invoice-footer{
max-width:800px;
margin:10px 10px 10px 10px;
padding:10px;
font-size:12px;
line-height:15px;
font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
color:#555;
}
.invoice-footer table {
border-collapse: collapse;
width: 100%
}
.invoice-footer table tr td table tr td {
border:1px solid black;
}
.invoice-footer table td{
padding:2px;
vertical-align:top;
}
.invoice-footer table tr.heading td{
background:#eee;
font-weight:bold;
}
.invoice-box{
max-width:800px;
height: 509.921259845px;
max-height: 509.921259845px;
border:1px solid black;
margin:10px 6px 10px 6px;
padding:10px;
font-size:12px;
line-height:15px;
font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
color:#555;
}
.invoice-box table{
width:100%;
text-align:left;
}
.invoice-box table td{
padding:2px;
vertical-align:top;
}
.invoice-box table tr.top table td{
padding-bottom:10px;
}
.invoice-box table tr.top table td.title{
font-size:45px;
line-height:45px;
color:#333;
}
.invoice-box table tr.information table td{
padding-bottom:10px;
line-height:20px;
}
.invoice-box table tr.heading td{
background:#eee;
font-weight:bold;
}
.invoice-box table tr.details td{
padding-bottom:10px;
}
.invoice-box table tr.item td{
}
.invoice-box table tr.item.last td{
border-bottom:none;
}
.invoice-box table tr.total td{
font-weight:bold;
}
@media only screen and (max-width: 600px) {
.invoice-box table tr.top table td{
width:100%;
display:block;
text-align:center;
}
.invoice-box table tr.information table td{
width:100%;
display:block;
text-align:center;
}
}
.page-number:before {
content: counter(page);
}
.body{
counter-reset: page 0;
}
#header { position: fixed;
top: -250px;
}
#footer { position: fixed;
bottom: 160px;
width: 100%;
text-align: center;
font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
font-size:8px;
}
#content {
position: fixed;
top: -80px;
}
@page {
margin: 432.283464565px 10px 57.79527559px 10px;
}
</style>
</head>
<body>
<div id='header'>
<div class='invoice-header'>
<table border=0 cellpadding='0' cellspacing='0' style='width:100%;'>
<tr>
<td width='50%'>
<table cellpadding='5' style='white-space: nowrap; text-align:center;'>
<tr class='heading'>
<td style='padding: 5px;'>Numero Factura</td>
<td style='padding: 5px;'>Fecha Factura</td>
</tr>
<tr>
<td style='padding: 5px;'>12313/2017</td>
<td style='padding: 5px;'>30/06/2017</td>
</tr>
</table>
</td>
<td width='50%'>
<table border=1 cellpadding='5' style='width:100%;'>
<tr>
<td style='line-height: 150%;'>
<div align='right'>123</div>
XXXXXXX, S.A.<br>
ADDRESS <br>
28042, MADRID<br>
Madrid<br>
CIF/NIF: 123123123
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<!-- Fin Cabecera -->
<!-- Inicio pie pagina -->
<div id='footer'>
<div class='invoice-footer'>
<table border=0 >
<tr>
<td style='width:25%'>
<table border=1 style='width:100%'>
<tr class='heading' style='text-align: center'><td>Forma de Pago<br>
CONFIRMING 60 DIAS F.F.</td></tr>
<tr class='heading' style='text-align: center'><td>Vencimiento</td></tr><tr style='text-align: center'><td>29/08/2017 - 148,04 €</td></tr>
</table>
</td>
<td style='width:40%'>
<table border=1 style='width:100%'>
<tr class='heading' style='text-align: center'>
<td colspan='5' style='height:16px'></td>
</tr>
<tr class='heading'>
<td>Iban</td>
<td>Entidad</td>
<td>Sucursal</td>
<td>D.C</td>
<td>Nº Cuenta</td>
</tr>
<tr>
<td style='text-align: center; height:16px'></td>
<td style='text-align: center; height:16px'></td>
<td style='text-align: center; height:16px'></td>
<td style='text-align: center; height:16px'></td>
<td style='text-align: center; height:16px'></td>
</tr>
</table>
</td>
<td style='width:35%'>
<!-- RESUMEN FACTURA -->
<table border=1 style='width:100%'>
<tr class='heading' style='text-align: center' nowrap><td colspan='2'>Resumen Factura</td></tr>
<tr><td style='text-align: left' nowrap>Base Imponible I.V.A 21% </td><td style='text-align: right' nowrap> 122,35 €</td></tr><tr><td style='text-align: left' nowrap>Importe I.V.A. 21% </td><td style='text-align: right' nowrap>25,69 €</td></tr><tr><td style='text-align: left' nowrap>Total </td><td style='text-align: right' nowrap>148,04 €</td></tr></table>
<!-- FIN RESUMEN FACTURA -->
</td>
</tr>
</table>
</div>
</div>
<!-- Fin pie pagina -->
<div id='content'>
<div class='invoice-box'>
<table border=0 cellpadding='0' cellspacing='0'>
<tr class='heading'>
<td colspan='2' style='text-align:left; padding-left:200px'>
Descripcion de los Servicios
</td>
<td style='text-align:right; padding-right:25px'>
Cantidad
</td>
<td style='text-align:right; padding-right:25px'>
Precio
</td>
<td style='text-align:right;'>
Total
</td>
</tr><tr>
<td colspan='2' style='text-align:left: padding-left:5px'>POR LOS SERVICIOS PRESTADOS DE LIMPIEZA DURANTE EL MES JUNIO
</td>
<td style='text-align:right;padding-right:25px'>1,00</td>
<td style='text-align:right;padding-right:25px'>122,35 €</td>
<td style='text-align:right'>122,35 €</td>
</tr>
</table>
<!-- FIN Detalle del informe -->
</div>
</div>
</body>
</html>
我尝试配置一个带背景但不起作用的div部分：
#fondocorporativo{
position:fixed
background-image: url(data:image;base64,".$fila_empresa['foliocorporativo'].");
}
我也尝试在身体中配置背景图像。但也没有用。
如何配置此图像：
作为完整发票的背景，如果使用css或使用dompdf canvas函数，则无关紧要。我试过了两个并且无法配置。
谢谢。
答案 0 :(得分：1)
最后我得到了答案。我创建了一个div容器，其中包含一个img元素，我希望将其作为背景，如下所示：
<div id='foliocorporativo'>
<img height='100%' width='100%' src='data:image/png;base64,".$fila_empresa['foliocorporativo']."'>
</div>
然后我为div容器创建了css样式：
#foliocorporativo{
position: absolute;
top:-430px
left:-1000px
z-index:-1;
}
在我的情况下，图像高度为1100px，宽度为780px。
编辑：您必须在标题div中写入div，否则您将只在第1页中获得背景。