dompdf с заголовком отчета, затем заголовком и нижним колонтитулом

Я пытаюсь создать отчет в формате PDF с помощью dompdf. В отчете должен быть логотип компании в верхней части первой страницы, а также верхний и нижний колонтитулы на каждой странице. Я нашел решения для добавления верхнего и нижнего колонтитула в документ dompdf в другом месте в stackoverflow. Проблема, с которой я сталкиваюсь, заключается в том, что логотип компании должен находиться над заголовком страницы на первой странице и не отображаться на других страницах.

что-то вроде этого

Company Logo
 - header
 - content here
 - footer
 ------
 - header
 - content here 
 - footer

Есть ли способ сделать это с помощью dompdf?


pdf-generation dompdf
person d_boggus    schedule 08.11.2012    source источник
comment
Старый вопрос, но ... может ли заголовок оставаться в том же месте или ожидается, что на первой странице он будет сдвинут вниз из-за логотипа?   -  person BrianS    schedule 11.01.2013

Ответы (1)


arrow_upward
5
arrow_downward

Это глупо, но работает. Вы можете подделать разные заголовки, создав обычный заголовок с фиксированным позиционированием и специальный заголовок страницы 1 с использованием абсолютного позиционирования. Если вы настроите все в правильном порядке, заголовок страницы 1 будет отображаться поверх стандартного заголовка, скрывая его.

<html>
  <head>
    <style>
      @page {
        margin: 0px;
      }
      @page :first {
        margin-top: 100px;
      }
      body {
        margin: 100px 20px 50px 20px;
      }
      #headerA {
        position: fixed;
        left: 0px; right: 0px; top: 0px;
        text-align: center;
        background-color: orange;
        height: 90px;
      }
      #headerB {
        position: absolute;
        left: -20px; right: -20px; top: -200px;
        text-align: center;
        background-color: orange;
        height: 190px;
      }
      #footer {
        position: fixed;
        left: 0px; right: 0px; bottom: 0px;
        text-align: center;
        background-color: orange;
        height: 40px;
      }
    </style>
  </head>
  <body>
    <div id="headerA">
      <h1>Widgets Express</h1>
    </div>
    <div id="headerB">
      <img class="logo" src="http://eclecticgeek.com/images/macro/ants.jpg" height="100" width="500">
      <h1>Widgets Express</h1>
    </div>

    <div id="footer">
      <p>Copyright, all rights reserved, yadda yadda</p>
    </div>

    <div id="content">
      ...
    </div>
  </body>
</html>
person BrianS    schedule 11.01.2013