Laravel中使用laravel-mpdf生成PDF时CSS失效及数值错误问题

我之前也碰到过类似的情况，咱们一步步排查解决：

先处理"A non-numeric value encountered"错误 #

这个错误出现在代码$size *= (25.4 / $this->dpi);，核心原因是$size不是有效的数值类型，大概率是CSS里的尺寸写法有问题，或者动态传递的尺寸值不合法。

解决步骤：

• 检查CSS尺寸写法：确保所有尺寸属性（width、height、padding等）的数值和单位之间没有空格，比如写width: 200px而非width: 200 px；同时尽量使用mpdf支持的单位（px、mm、cm），避免用em、rem这类处理难度高的单位。
• 校验动态尺寸值：如果你的尺寸是从变量/数据库获取的，先做类型转换，比如用(float)$size或intval($size)确保它是纯数值，避免传递字符串格式的无效值。
• 明确设置dpi：在laravel-mpdf的配置文件（config/mpdf.php）里添加或修改'dpi' => 96，固定dpi值，避免因dpi异常导致计算出错。

解决CSS在PDF中不生效的问题 #

mpdf对CSS的支持和浏览器有差异，很多时候是写法兼容性的问题：

解决步骤：

• 优先使用内联CSS：mpdf对内联样式的解析最稳定，尽量把样式直接写在HTML标签的style属性里，比如<div style="width: 100%; color: #333;">，代替外部样式表或<style>标签里的类选择器。
• 避免不支持的CSS特性：mpdf不支持部分现代CSS属性（比如flex布局的部分属性、伪类:hover等），如果用了这些特性，换成传统的布局方式（比如float、table布局）。
• 嵌入CSS内容而非引用外部文件：如果之前用<link>引用外部CSS，尝试把CSS代码直接复制到HTML的<style>标签中，避免mpdf加载外部资源时出现异常。
• 规范HTML结构：检查HTML是否有未闭合的标签、嵌套错误，不规范的结构会导致mpdf解析CSS时出错。

先搞定数值错误，因为这个错误可能会中断PDF渲染流程，进而导致CSS无法正常生效。调整完后再测试CSS的显示效果，应该就能解决问题了。

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