MPDF中div元素的border及border-radius样式不生效问题求助

1. 给元素添加空间并修正显示类型 #

MPDF对没有足够内部空间的元素，边框可能不渲染。给元素加padding，同时针对内联元素（比如<span>）强制转为块级或行内块：

<div style="border:1px solid black; padding: 2px;">2. Lorem ipsum dolor sit amet</div>
<span style="display: inline-block; border:1px solid black; padding: 2px;">2. Lorem ipsum dolor sit amet</span>

2. 拆分边框属性避免简写解析问题 #

部分MPDF版本对border简写支持不佳，可单独指定各边边框：

<div style="border-top:1px solid black; border-right:1px solid black; border-bottom:1px solid black; border-left:1px solid black; padding: 2px;">2. Lorem ipsum dolor sit amet</div>

3. 升级MPDF并调整初始化配置 #

旧版MPDF的CSS支持存在缺陷，升级到最新稳定版。初始化MPDF时开启相关CSS支持配置：

$mpdf = new \Mpdf\Mpdf([
    'mode' => 'utf-8',
    'format' => 'A4',
    'cssFloat' => true,
]);

4. 用表格模拟边框（兜底方案） #

MPDF对表格边框的渲染兼容性更好，可直接用表格替代：

<table style="border:1px solid black; border-collapse: collapse;">
    <tr>
        <td style="padding: 2px;">2. Lorem ipsum dolor sit amet</td>
    </tr>
</table>

内容的提问来源于stack exchange，提问作者wrox