我使用 dompdf 为参与者创建数字证书。 PDF创建成功，但是有一个问题，生成的PDF在第一页上显示了一个空白页，这是不应该存在的。
如果我回显 html 代码，则没有错误并且它会按我想要的方式显示
这是我创建的代码：
....
$html='
<!doctype html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
</head>
<style>
@page{margin:0px;}
@font-face {
font-family: "Tangerine_Regular";
font-style: normal;
font-weight: 500;
src: url("https://qrcode.ffpm-iafmi.com/sertifikat/Tangerine_Regular.ttf") format("truetype");
}
body{margin:0px;}
#bgs{
width:841pt;
height:595pt;
background:url(bg1.png);
background-size:contain;
background-repeat:no-repeat;
padding-top:345px;
text-align:center;
font-family:arial;
line-height:1;
overflow:hidden;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
}
#spk{
width:841pt;
height:595pt;
background:url(bg2.jpg);
background-size:contain;
background-repeat:no-repeat;
}
.names{
font-family: "Tangerine_Regular", serif;
font-size:70px;
font-weight:500;
color:#192489;
}
</style>
<body>
<div id="bgs">
<span class="names"><u>'.$name.'</u></span><br/>
<span style="font-size:22px;"><i>'.$roles.'</i></span>
</div>
<div id="spk"></div>
</body>
</html>';
$dompdf->loadHtml($html);
$dompdf->set_option('isRemoteEnabled',true);
$dompdf->set_paper(array(0,0,841,595));
$dompdf->render();
$dompdf->stream("e-Certificate for ".$name);
//echo $html;
}
我的脚本中缺少什么？
我已经设法找到了我的问题的解决方案，看来问题出在样式的编写上（padding-top：345px）。 因此，我删除了样式，并在第一个 div 内放置了一个 div，样式高度为：345px。第一个空白页消失了。
这是我使用的设置 1.去掉padding-top样式：
#bgs{
width:841pt;
height:595pt;
background:url(bg1.jpg);
background-size:contain;
background-repeat:no-repeat;
text-align:center;
font-family:arial;
line-height:1;
}
2.然后在第一个div内放置一个div，样式高度：345px
<div id="bgs">
<div style="width:1000px;height:345px;"></div>
<span class="namanya"><u>'.$name.'</u></span><br/>
<span style="font-size:22px;"><i>'.$roles.'</i></span>
</div>
<div id="spk"></div>
所以，在我看来，margin 和 padding 的使用存在问题