MPDF整页背景 [英] MPDF full page background

问题描述

我花了太多时间在此上，我想不出一个好的21世纪解决方案.

I spent way too much time on this and I can't figure out a good 21th century solution.

我只需要生成带有背景图像的PDF名片，但是MPDF并不是很有帮助.

Simply I have to generate a business card in PDF with a background image, but MPDF isn't very helpful.

默认情况下，我有:

@page{
    sheet-size: 90mm 55mm;
    margin: 0;
}

我试图:

• 使用@page {背景大小:100％； } doesn't work
• 使用@page {背景大小:封面； } doesn't work
• 调整图像大小-即使将 background-image-resolution (背景图像分辨率)设置为与图像相同的值，即使我在"mm"中设置了正确的尺寸，它也会变小或变大.
• 将绝对放置在具有背景图像的div上
• 相同，但具有img标签，并使用src属性.

• use @page{ background-size: 100%; } doesn't work
• use @page{ background-size: cover; } doesn't work
• resize the image - even if I set the right size in 'mm', it will be smaller or larger, even if I set the background-image-resolution to the same value as the image.
• place absolute positioned div with background image
• same but with img tags, using src attribute.

在最后一个选项中，我有一个非常奇怪的事情.它显示了整个图像，但在页面上显示为一个小矩形，但没有显示整个高度.

At the last option, I've got a really strange thing. It showed the whole image but in a small rectangle in the pages, but not even in full height.

有人有想法，如何简单地将图像用作页面背景吗?

推荐答案

mPDF具有用于背景图像的自定义css属性:background-image-resize，其自定义值介于0到6之间:

mPDF has a custom css property for background images: background-image-resize with custom values from 0-6:

• 0-不调整大小(默认)
• 1-缩小以适合w(保持宽高比)
• 2-缩小至适合的h(保持宽高比)
• 3-缩小以适合w和/或h(保持宽高比)
• 4-调整大小以适应w(保持宽高比)
• 5-调整大小以适应h(保持宽高比)
• 6-调整大小以适合w和h

因此，您可能需要: 正文{background-image:url(something.png); background-image-resize:6}

So you probably need: body {background-image:url(something.png); background-image-resize:6}

来自mPDF文档

这篇关于MPDF整页背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！