0

我正在尝试使用 Dompdf 生成 pdf。我有以下用于设计我生成的 pdf 的脚本。

<html>
<head>
<style>
@page { margin: 180px 50px; }
#header { position: fixed; left: 0px; top: -180px; right: 0px; height: 120px; background-color:  orange; text-align: center; }
#footer { position: fixed; left: 0px; bottom: -180px; right: 0px; height: 150px; background-color: lightblue; }
#footer .page:after { content: counter(page, upper-roman); }
</style>

<body>
      <div id=\"header\">

     <h1>Charlie Sheen</h1>
     </div>

      Hi, This is Charlie Sheen <br>

    <p> Winning </p>
   <p> Winning </p>
  <p> Winning </p>
   <p> Winning </p>
    <p> Winning </p>
     <p> Winning </p>
      <p> Winning </p>

   <div id=\"footer\">
 <p class=\"page\">Page </p>
 </div>
 <div id=\"content\">
 <p>the first page</p>
 <p style=\"page-break-before: always;\">the second page</p>
 </div>                  

 </body>
</html>

在此处输入图像描述

当我生成 PDF 时,它看起来像上面的图像。现在我的问题是我希望我的内容从比现在开始的高一点开始。如果你注意到上面的图片有一个句子“嗨,这是查理辛”......我想从上面开始。我试图在样式中添加以下代码,但它不起作用:

#content { position: fixed; margin-top: 0px;}

请你帮我从上面的内容开始吗?

提前致谢 :)

4

2 回答 2

0

更改页边距#content不会产生影响,因为#content它位于页面下方。

我会考虑将第一句话包装在p标签中,就像这样

<p>Hi, This is Charlie Sheen</p>

于 2011-12-30T02:15:11.087 回答
0

您正在将正文从文档的顶部和底部推入 180px@page { margin: 180px 50px; }处 但是,标题的高度只有 120 像素。所以标题和正文内容之间自然会有 60px 的空间。您应该增加标题的大小或减少@page边距。

<html>
<head>
    <style>
        @page { margin: 120px 50px; }
        #header { position: fixed; left: 0px; top: -120px; right: 0px; height: 120px; background-color:  orange; text-align: center; }
        #footer { position: fixed; left: 0px; bottom: -120px; right: 0px; height: 150px; background-color: lightblue; }
        #footer .page:after { content: counter(page, upper-roman); }
    </style>

<body>
    <div id="header">
        <h1>Charlie Sheen</h1>
    </div>

    <div id="footer">
        <p class="page">Page </p>
    </div>

    <div id="content">
        <p>Winning!</p>
        <p style="page-break-before: always;">Winning!</p>
    </div>
</body>
</html>

(你的原始代码,清理了一下。)

于 2012-01-03T20:09:54.333 回答