如何判断mPDF页面奇偶性？解决横向图片定位难题

我之前在做mPDF项目时刚好碰到过和你一模一样的问题——开启mirrorMargins后横向图片的定位总是跑偏，折腾了几种方法都可行，给你分享下：

1. PHP层面动态判断页码奇偶，精准控制样式 #

mPDF可以通过$mpdf->page属性获取当前页码（注意：这个值会在内容写入后实时更新），你可以根据页码奇偶给图片添加不同的CSS类，再通过CSS定义对应的负边距：

比如先在HTML中给图片标记基础类：

<div class="landscape-img-wrapper">
    <img src="your-landscape-image.jpg" class="landscape-img" />
</div>

然后在PHP处理时，替换类名：

// 初始化mPDF后，写入内容前获取当前页码
$currentPage = $mpdf->page;
// 根据奇偶页替换类名
$html = str_replace(
    'class="landscape-img"',
    'class="landscape-img ' . ($currentPage % 2 === 1 ? 'odd-page' : 'even-page') . '"',
    $html
);
$mpdf->WriteHTML($html);

再搭配CSS：

.landscape-img {
    width: 297mm; /* A4横向满幅宽度，按需调整 */
}
.landscape-img.odd-page {
    margin-left: -20mm; /* 对应奇数页左侧边距的负值 */
}
.landscape-img.even-page {
    margin-right: -20mm; /* 对应偶数页右侧边距的负值 */
}
/* 可选：防止图片被分页拆分，保证在单页内 */
.landscape-img-wrapper {
    page-break-inside: avoid;
}

2. CSS层面利用mPDF的页面伪类 #

mPDF 6.1原生支持@page :left和@page :right伪类，刚好对应镜像边距下的偶数页和奇数页，直接在页面规则里定义图片样式更省心：

/* 奇数页（镜像边距下的右侧页面） */
@page :right {
    .landscape-img {
        width: 297mm;
        margin-left: -18mm; /* 按实际边距调整负值 */
    }
}

/* 偶数页（镜像边距下的左侧页面） */
@page :left {
    .landscape-img {
        width: 297mm;
        margin-right: -18mm; /* 按实际边距调整负值 */
    }
}

这种方式不需要PHP介入，适合纯HTML+CSS生成PDF的场景，只要图片在页面流中即可生效。

3. 直接用mPDF的Image()方法动态设置边距 #

如果是直接通过PHP的$mpdf->Image()添加图片（而非HTML），可以直接判断页码后设置边距参数：

$currentPage = $mpdf->page;
// 根据奇偶页设置不同的边距
$marginLeft = $currentPage % 2 === 1 ? -20 : 0;
$marginRight = $currentPage % 2 === 0 ? -20 : 0;

// 调用Image方法，最后几个参数对应上下左右边距
$mpdf->Image(
    'your-image.jpg',
    0, 0, // x,y坐标
    297, 210, // 宽高，A4横向尺寸
    'JPG', '', false, 'L', false,
    $marginLeft, 0, $marginRight, 0 // 左、上、右、下边距
);

这个方法最直接，适合完全用PHP控制PDF内容的场景。

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