Dompdf将html引导程序代码打印为col-sm-x而不是col-lg-x

Pat*_*ros 1 html dompdf twitter-bootstrap

我在PHP中使用Dompdf以便以PDF格式打印报告。我不知道如何以在屏幕上看到的方式打印HTML引导程序代码。例如,您知道如果设备较小,引导网格将崩溃。在这种情况下,在我的PDF中,网格看起来就像是位于移动设备或表格中一样,例如col-xs-xcol-sm-x代替col-lg-x。有没有一种方法可以在Dompdf中指定视图的外观col-lg-x

这是示例html引导程序代码:

$content2='<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <div class="jumbotron">
    <h1>My First Bootstrap Page</h1>
    <p>Resize this responsive page to see the effect!</p>
  </div>
  <div class="row">
    <div class="col-sm-4 col-md-4 col-lg-4">
      <h3>Column 1</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
    <div class="col-sm-4 col-md-4 col-lg-4">
      <h3>Column 2</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
    <div class="col-sm-4 col-md-4 col-lg-4">
      <h3>Column 3</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit...</p>
      <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris...</p>
    </div>
  </div>
</div>

</body>
</html>';
Run Code Online (Sandbox Code Playgroud)

这是其余的代码:

$pdf = new Dompdf();
$pdf->loadHtml($content2);
$pdf->render();
$pdf->stream();
Run Code Online (Sandbox Code Playgroud)

举例来说,在我的屏幕,柱 <h3>Column 1</h3><h3>Column 2</h3>以及<h3>Column 3</h3>出现在同一行。但是在pdf中,它们分别以不同的行出现(折叠为col-xs-x)。连续有一个。而不是三合一->作为我想要的方式(此处为示例)。

imv*_*in2 5

一些注意事项: col-sm-4 col-md-4 col-lg-4

可以简化为 col-sm-4

您遇到的主要问题是PDF转换器基本上是在转换为打印屏幕。打印的最大宽度比浏览器小得多。

你可以尝试COL-XS-4替代