按比例缩放HTML以完全适合PDF A4大小

I am using PHP, Mysql, jQuery. I have a webpage that is to be converted into high-res A4 size PDF: http://optisolbusiness.com/funeral_site/sample/index/id/255.

I have converted the HTML to PDF using wkhtmltopdf, which works great.

Here is the generated PDF http://optisolbusiness.com/Guru/Gurupdf/optisol.pdf. But the HTML is not fitting exactly to PDF size; There are spaces around the HTML in PDF. How to scale HTML to fit A4 PDF size 100%? Importantly the content inside the html (ie) text size, images width and height, background images also to be scaled proportionally.

Your background image is not exactly high-res, this won't look great in print.

I don't know wkhtmltopdf itself, but your body already has absolute dimensions set (in inches). This is probably the problem. Your body has a max size, the content has an absolute size too (given due to the background image pixel dimensions).

This is not a good starting point for html-to-print transformaions, and PDF is essentially print.

what to do (intermediate)

  • remove any size restrictions from body
  • wkhtml... has a switch called zoom, 1.5 should be an appropriate value to fill the page
  • use page-size a4

what to do (the "right" way)

  • remove size restrictions from body
  • build the background borders (the black ones) with html elements and css styling
    • refrain from defining "width" rules for those. You will only have to define a "width" once, all other widths should be set to "auto".
    • heights will prove troublesome, because divs are only as high as their content requires. But setting height: 100% does not respect border and margin sizes.
  • that yellow cross could be designed in css too, or a much higher resolution png/jpeg
  • Use only "real" dimensions. That means do not use pixels, use points, inches, or mm. You can use % values, but make sure those are % values of real dimensions (that means that at some point a parent element has a real dimension)

You can set the size of the body to the size of the page.. in case of A4 that is 210x297mm.

Btw: you should only be using width in percentage, otherwise wkhtmltopdf will have to try and convert it.

So make sure you use width: 100%; if you want it to fill all the room. ;)

BTW: If you want real high quality PDFs you will need to create them conforming to at least the PDF/X-3 standard. I don't think wkhtmltopdf does that tho.

I'd say that you're always going to struggle to get this to be perfect. In my opinion you're better off writing the PDF directly rather than relying on a third party tool.

Consider looking into FPDF, an open-source PHP PDF writing library. Be warned, the website looks out of date, but the functionality works beautifully.