Question

enter image description here

这就是我想要我的pdf的样子。但是当我将这个html转换为pdf时，输出就像这样

enter image description here

以下HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test pdf</title>
</head>

<body>
<table width="100%" height="113" border="2" cellpadding="0" cellspacing="0">
  <tr>
    <td width="150" height="113" rowspan="2"><img src="images/mylogo.jpg" alt=" " height="113" width="150" /></td>
    <td height="93" align="right"><h1>INVOICE</h1></td>
  </tr>
  <tr>
    <td bgcolor="#993366"></td>
  </tr>
</table>

</body>
</html>

我尝试使用div并尝试了各种选项，但最终输出类似于上面的那个。

有人能指出我正确的方向吗？

Answer 1

使用Mpdf。创建pdf文件非常有用。

http://www.mpdf1.com/mpdf/index.php

Answer 2

行距和计算第二行的高度似乎有问题。这似乎是dompdf在处理此代码时出现的错误行为。我向issue tracker发布了一份报告（如果您有兴趣的话）。

您可以在没有表格的情况下创建相同的布局，从而为您提供更精确的控制。您是否考虑过以不同方式创建标题？ e.g。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>test pdf</title>
  </head>

  <body>
    <div style="height: 113px; margin: 0px; padding: 0px; background-color: #993366; border: 2px solid gray">
      <div style="float: left; width: 150px;"><img src="http://placekitten.com/150/113" alt=" " height="113" width="150" /></div>
      <div style="background-color: white; padding: 30px 0px 30px 0px; text-align: right;"><h1 style="margin: 0px;">INVOICE</h1></div>
    </div>
  </body>
</html>

无法使用dompdf创建带有图像的pdf

2 个答案: