在dompdf html表中插入图像

Question

我想在我的DOM pdf中创建以下布局类型。我尝试使用CSS，但无法正常工作。在这里，我上传了预期的输出屏幕截图。有帮助吗？

<div class="gallery" style="padding:0 15px 0 15px;">
            <table>
                <tr>
                   <td style="padding:5px;">
                    <div style="width:350px; height:300px; min-height:300px;"><img src="http://ec2-54-183-156-161.us-west-1.compute.amazonaws.com/images/1.png" style="height:300px;width:350px;"></div>
                   </td>
                  <td rowspan=2 style="padding:5px;">
                    <div style="width:720px; height:500px; min-height:500px;"><img src="http://ec2-54-183-156-161.us-west-1.compute.amazonaws.com/images/1.png" style="height:500px;width:720px;"></div>
                  </td>
                </tr>
                <tr>
                  <td style="padding:5px;">
                    <div style="width:350px; height:300px; min-height:300px;"><img src="http://ec2-54-183-156-161.us-west-1.compute.amazonaws.com/images/2.png" style="height:300px;width:350px;"></div>
                 </td>
                </tr>
            </table>
        </div>

enter image description here

Answer 1

除了样式外，您的图片还有问题。它们的一部分是透明的，无论您做什么，它们都不会填充表格单元格。这是您的代码，有一些微小的变化和不同的照片：

<div class="gallery" style="padding: 0 15px 0 15px;">
                <table>
                    <tbody>
                        <tr>
                            <td style="padding: 5px; vertical-align: top;">
                                <div style="width: 350px; min-height: 244px;">
                                    <img src="https://placeimg.com/350/244/nature" ></div>
                            </td>
                            <td rowspan="2" style="padding: 5px; vertical-align: top;">
                                <div style="width: 720px; height: 500px; min-height: 500px;">
                                    <img src="https://placeimg.com/720/500/nature"</div>
                            </td>
                        </tr>
                        <tr>
                            <td style="padding: 5px; vertical-align: top;">
                                <div style="width: 350px; min-height: 244px;">
                                    <img src="https://placeimg.com/350/244/nature" ></div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>