2016-05-31 80 views
-1

我正在网站上开发一个模块,将一些报告导出为pdf。在谷歌搜索哪种类型的库可以帮助我后,我发现DOMPDF(PHP)。DomPDF不适用于div表吗?

我创建并正确显示PDF,但我必须创建与表格,TR和TD的HTML,因为当我尝试显示相同的使用显示选项设置在表,表行或表格单元格上的div不起作用并且不以正确的制表格式显示数据。

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

任何一个如果是编程问题,dompdf问题或其他?

任何建议welcomen。

在这里,代码

   <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与显示:表作为表标记,和div与显示:表行作为tr标记,最后div与显示:table-cell作为td标记。

谢谢。

+0

请分享您所使用的HTML/CSS的一个样本。 – BrianS

回答

0

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表)页面。您可以通过围绕相关的CSS @media dompdf { ... }来始终在样式表中定位dompdf。