如何让MPDF呈现Bootstrap表样式

时间:2015-05-14 07:04:48

标签: twitter-bootstrap mpdf

我已经尝试了一段时间来创建一个带有mpdf的bootstrap页面的pdf,而不是丢失表格和其他样式。从我在mpdf网站上看到的是我支持的样式是支持的,所以不确定问题是什么。正在应用其他样式。只是不是这些表类。

表有这些类:" table table-striped table-responsive small"

Bootstrap 3.3.1和mPDF 5.7& 6

页面在浏览器中按预期显示,但pdf被剥去了表格样式,导致可读性问题。

我已尝试从bootstrap.min.css中删除@print,如下所述:https://stackoverflow.com/a/27299382/1181367但没有任何区别。

提前感谢您提供的任何输入。

2 个答案:

答案 0 :(得分:0)

当我使用mpdf生成发票时,我遇到了这个问题。 它无法应用.css文件或标记中给出的CSS。 但无论我设置哪个,都可以在浏览器中正确显示格式。

所以我试着把css作为内联 喜欢:

<div style="display:block;color:#000;"></div>

它可以解决我的问题。

其次,这种方法也可以帮助你:

$mpdf=new mPDF();
$stylesheet = file_get_contents('stylesheet.css'); // external css
$mpdf->WriteHTML($stylesheet,1);
$mpdf->WriteHTML($html,2); //$html contain your html code to display in pdf.
$mpdf->Output();

答案 1 :(得分:0)

对于条带化表格,您可以使用以下css。

 <style>
    tr:nth-child(even) {
    background-color: #f2f2f2;
}
  </style>