Question

我正在网站上开发一个模块，将一些报告导出为pdf。在谷歌搜索哪种类型的库可以帮助我后，我找到了DOMPDF（php）。

我正在创建并正确显示pdf，但我必须使用表格，tr和td创建html，因为当我尝试使用显示选项设置在表格，表格行或表格单元格上时使用div显示相同的内容不起作用，不以正确的表格格式显示数据。

这是一个问题，因为在视图中我尝试使用div和responsiv设计，但是当我作为参数传递时，这个html它不起作用。通过这个事实，当我测试这个时，我不得不用两个html代码创建一个视图。视图渲染的第一个用div设计，另一个用table标签作为参数传递给dompdf渲染。

任何人都可能是编程问题，dompdf问题还是别的什么？

任何建议都是欢迎。

这里是代码

                <link href="pdf.css" rel="stylesheet" type="text/css"   media="screen" />
                <div class="tabledivinscripcion">
                <div class="titular-inscripcion">
                        <img id="header" class="headers" src="ImagenesNoticias/'.$row_headers["timestamp"].'_'.$row_headers["header"].'"/>
                </div>

                <table>
                    <tr>
                        <td colspan="1"> <b>INFORME DE:</b>'.$row["nombreInforme"].'</td>
                        <td colspan="1" > <b>Categoría:</b>'.$row["categoria"].'</td>
                    </tr>                   
                    <tr>
                        <td colspan="1"> <b>Fecha:</b>'.$row["fecha"].'</td>
                        <td colspan="1"> <b>Hora:</b>'.$row["hora"].'</td>
                    </tr> 
                    <tr>
                        <td colspan="1"> <b>Nombre:</b>'.$row["nombre"].'</td>
                        <td colspan="1"> <b>Licencia:</b>'.$row["licencia"].'</td>
                    </tr>
                    <tr>
                        <td colspan="1"> <b>Categoría:</b>'.$row["categoria2"].'</td>
                        <td colspan="1"> <b>Manga:</b>'.$row["manga"].'</td>
                    </tr>
                    <tr>
                        <td colspan="2"> <b>Hora del hecho::</b>'.$row["horaHecho"].'</td>
                    </tr>
                    <tr>
                        <td colspan="2"> <b>Descripción:</b>
                            <br>
                            <p class="justified">'.$row["descripcion"].'</p>
                            <br>  
                        </td>
                    </tr>
                    <div class="titular-inscripcion foot">
                            <img id="footer" class="headers" src="ImagenesNoticias/'.$row_headers["timestamp"].'_'.$row_headers["footer"].'"/>
                    </div>

这里是css

    .headers{
    width:100%;
    }
    td{
    //border:1px solid black;
    text-align:left;
    height:25px;
    }
tr{
    //border:1px solid red;
}
table{
   // border:1px solid green;
    height:75%;
    width:85%;
    margin-left:auto; 
    margin-right:auto
}
.justified{
    text-align:justify;
}
.tabledivinscripcion{
    background:#FFF;
    margin-bottom:20px;
    padding:0px;
    position:relative;
    width:100%;
    min-height:100%;
    margin-left:auto;
    margin-right:auto;
}
.foot{
    position: absolute; 
bottom: 0;
}
.pdescripcion{
    text-align: justify;
    display:inline-block;
    padding-left:10px;
    padding-right:10px;
}
.titular-inscripcion{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    display:table;
    width: 100%; /*Optional*/
    table-layout: fixed; /*Optional*/
}

附上此代码是pdf的最终版本。为了对div做同样的事情，我尝试将div放在display：table作为表标签，div放置display：table-row作为tr标签，最后div作为显示：table-cell作为td标签。

谢谢。

Answer 1

Dompdf可以处理使用CSS表格显示类型构建的表格。例如，以下内容应显示100％宽度的表，其中包含两列。您会注意到特定于表的属性将适用。在第一行和第二行中的单个生成列。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <style>
    .table { display: table; width: 100%; border-collapse: collapse; }
    .table-row { display: table-row; }
    .table-cell { display: table-cell; border: 1px solid black; padding: 1em; }
  </style>
</head>
<body>
  <div class="table">
    <div class="table-row">
      <div class="table-cell"><b>INFORME DE:</b>dompdf</div>
      <div class="table-cell"><b>Categoría:</b>tables</div>
    </div>
    <div class="table-row">
      <div class="table-cell" colspan="2"> <b>Hora del hecho:</b>9:00</div>
    </div>
  </div>
</body>
</html>

当前版本不支持的内容（本文中的0.7.0）是与响应式设计（如媒体查询）相关的CSS声明（超出针对特定显示类型的那些，例如@media print）

您应该考虑为各种显示环境创建多个样式表，而不是创建包含多个结构元素（表和div表）的页面。您始终可以通过使用@media dompdf { ... }包围相关CSS来在样式表中定位dompdf。

DomPDF不能与div表一起使用？

1 个答案: