2017-11-16 4 views
0

wkhtmltopdf를 통해 일부 html을 출력하고 사용자 정의 머리글과 바닥 글을 사용하고 있습니다.Wkhtmltopdf 일관되지 않은 출력

<!doctype html> 
<html> 
<head> 
    <style> 
     body { 
      font-size: 12px; 
      margin: 0; 
      padding: 0; 
     } 

     .page-footer { 
      background: #2A5266 -webkit-linear-gradient(
       left, 
       #cbd5da 0, 
       #cbd5da 50pt, 
       white 50pt, 
       white 75pt, 
       #cbd5da 75pt, 
       #cbd5da 100pt, 
       white 100pt, 
       white 125pt, 
       #2A5266 125pt, 
       #2A5266 
      ); 
      height: 26pt; 
      border: none; 
      margin: 0; 
      padding: 0; 
      width: 100%; 
      position: relative; 
      display: block; 
     } 
    </style> 
</head> 
<body> 

<div class="page-footer"></div> 

</body> 
</html> 

다음과 같이 내가 사용 명령은 다음과 같습니다 :

<!doctype html> 
<html> 
<head> 
    <style> 
     body { 
      font-size: 12px; 
      margin: 0; 
      padding: 0; 
     } 

     .page-header { 
      background: #2A5266 -webkit-linear-gradient(
       left, 
       #cbd5da 0, 
       #cbd5da 50pt, 
       white 50pt, 
       white 75pt, 
       #cbd5da 75pt, 
       #cbd5da 100pt, 
       white 100pt, 
       white 125pt, 
       #2A5266 125pt, 
       #2A5266 
      ); 
      height: 72pt; 
      border: none; 
      margin: 0; 
      padding: 0; 
      width: 100%; 
      position: relative; 
      display: block; 
     } 
    </style> 
</head> 
<body> 

    <div class="page-header"> 
    </div> 

</body> 
</html> 

바닥 글 HTML은 다음과 같습니다

wkhtmltopdf -L 0cm -R 0cm -T 2.75cm -B 0.7cm -O landscape --footer-html http://foo.com/footer --header-html http://foo.com/header --header-spacing 5 http://foo.com/html output.pdf 

모두를 다음과 같이

헤더 HTML입니다 100 % 올바르게 작동하지만 헤더가 선형 그래디언트를 사용하지 않습니다. 헤더가 단색의 진한 파란색이기 때문에 거의 선형 그래디언트와 비슷합니다. 보시다시피, 머리글과 바닥 글에 대한 html은 거의 동일하므로 헤더가 아니라 머리글에 사용할 수 있습니다.

헤더의 position:absolute을 변경하면 헤더 그라디언트가 나타나지만 너무 많은 다른 문제가 발생합니다.

답변

1

결국 각 td 요소에 대해 폭을 명시 적으로 설정 한 테이블을 사용했는데 완벽하게 작동합니다.

+0

당신은 당신의 자신의 대답을 받아 들일 수 있습니다. – Nenotlep

관련 문제