Bootstrap 无法在 pdf 中工作
Bootstrap not working inside pdf
这是我的控制器代码
public function actionPrint_death_certificate1()
{
$this->layout = 'certificate';
$html = $this->render('test');
require_once(Yii::$app->basePath . "/../vendor/mpdf/mpdf/mpdf.php");
$mpdf=new mPDF();
$mpdf->WriteHTML($html);
$mpdf->Output();
}
我的看法
<div class="container">
<div class="row">
<div class="col-md-6">
Heading1
</div>
<div class="col-md-6">
Heading2
</div>
</div>
</div>
现在我得到一个 pdf,其中 heading1 和 heading2 分两行。 Bootstrap 无效。我错过了什么吗?
return $this->render('test');
当我尝试这个时,它工作正常,heading1 和 heading2 排成一行。在 pdf 中它不起作用
您可以使用 $mpdf->WriteHtml($stylesheet, 1)
功能在您的 pdf 中添加自定义样式表,有关更多信息,您可以查看此 link http://mpdf1.com/manual/index.php?tid=254
public function actionPrint_death_certificate1()
{
$this->layout = 'certificate';
$html = $this->render('test');
$stylesheet = file_get_contents('style.css');
require_once(Yii::$app->basePath . "/../vendor/mpdf/mpdf/mpdf.php");
$mpdf = new mPDF();
$mpdf->WriteHTML($stylesheet, 1);
$mpdf->WriteHTML($html);
$mpdf->Output();
}
我在 github 中发布了一个问题,mpdf 人员告诉我 bootstrap 在 mpdf 中不支持 out-of-the-box 并且你必须使用一些自定义样式。 Github link
来自@Bloodhound post - 这个解决方案很适合我
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
border:0;
padding:0;
}
伙计们,我发现这是由 bootstrap 框架的打印样式引起的。
将它添加到样式表中解决了我的问题:)
@media print {
@page {
size: auto;
}
}
这是我的控制器代码
public function actionPrint_death_certificate1()
{
$this->layout = 'certificate';
$html = $this->render('test');
require_once(Yii::$app->basePath . "/../vendor/mpdf/mpdf/mpdf.php");
$mpdf=new mPDF();
$mpdf->WriteHTML($html);
$mpdf->Output();
}
我的看法
<div class="container">
<div class="row">
<div class="col-md-6">
Heading1
</div>
<div class="col-md-6">
Heading2
</div>
</div>
</div>
现在我得到一个 pdf,其中 heading1 和 heading2 分两行。 Bootstrap 无效。我错过了什么吗?
return $this->render('test');
当我尝试这个时,它工作正常,heading1 和 heading2 排成一行。在 pdf 中它不起作用
您可以使用 $mpdf->WriteHtml($stylesheet, 1)
功能在您的 pdf 中添加自定义样式表,有关更多信息,您可以查看此 link http://mpdf1.com/manual/index.php?tid=254
public function actionPrint_death_certificate1()
{
$this->layout = 'certificate';
$html = $this->render('test');
$stylesheet = file_get_contents('style.css');
require_once(Yii::$app->basePath . "/../vendor/mpdf/mpdf/mpdf.php");
$mpdf = new mPDF();
$mpdf->WriteHTML($stylesheet, 1);
$mpdf->WriteHTML($html);
$mpdf->Output();
}
我在 github 中发布了一个问题,mpdf 人员告诉我 bootstrap 在 mpdf 中不支持 out-of-the-box 并且你必须使用一些自定义样式。 Github link
来自@Bloodhound post - 这个解决方案很适合我
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
border:0;
padding:0;
}
伙计们,我发现这是由 bootstrap 框架的打印样式引起的。
将它添加到样式表中解决了我的问题:)
@media print {
@page {
size: auto;
}
}