phantomjs不正确的pdf呈现

我想从一个html页面生成pdf。 html非常简单，并为每个页面呈现一个居中图像。phantomjs不正确的pdf呈现

css我已经正常工作时，我呈现的HTML但它不会当我试图创建一个PDF与它node-html-pdf。

我还创建GitHub上一个小快递应用程序，它再现了问题： https://github.com/aschmid/phantomjs2pdf

什么是在PDF怪异的是，第2页正确渲染。
再经过每一个页面是200％，前一个的大小：

我相信这是与CSS的问题。我也想创建适用于每个纸张尺寸（letter，tabloid，A4，....）或方向（纵向，横向）的css规则，并将图像置于pdf中的页面中央。

有人能指点我正确的方向吗？

来源

2016-01-12 aschmid00

内置环境的一个副本在我的机器，并计算出添加此代码解决了该问题：

html, body { 
    max-height:100%; 
}

起初我还以为是

top: 50%; 
left: 50%;-webkit-transform: translateX(-50%) 
translateY(-50%);

招但那一点都不“T。我的max-height正文和HTML标签确保没有任何东西通过您的网页。

而且，虽然它不是要问两个不同的东西，有一个问题很合适，这里的一些代码来设置你掉踪使这项工作对风景和肖像模式上：

@media screen and (orientation:portrait) { 
     .page .imgWrapper img { 
      -ms-transform: rotate(90deg); 
      -webkit-transform: rotate(90deg) translateX(-29%) translateY(87%); 
     } }

这将找到您的视口的位置，并将图像置于纵向模式。奇怪的translate值是由于与rotate的奇怪交互。也许这不是与html-pdf一起工作，但它是一个开始。祝你好运。

来源

2016-01-19 22:07:43

感谢您的回答！生病在接下来的几天检查出来，让你知道。 – aschmid00

不客气。 –

只是测试它，它完美的作品。不确定为什么你添加了最后一个'@ media'片段，因为上述方法在任一方向都可以正常工作。 – aschmid00

phantomjs不正确的pdf呈现

回答

相关问题