Question

我在dompdf的pdf创建中遇到了一个小问题。在html页面标题位置：修复内容重叠在页面的页眉上。页面的内容是动态加载的。可以清除内容重叠问题。像这个链接的{html版本html

Answer 1

目前根据主要内容容器或body元素放置定位内容。为确保没有重叠，请为页面添加边距，然后对内容进行负面定位，将其移到正文外（#header { position: fixed; top: -50px; left: 0px; right: 0px; height: 50px; }）。

例如：

<html>
<head>
  <style>
    @page { margin: 50px; }
    body { background-color: #c0ccff; padding: 1em; }
    #header { position: fixed; top: -50px; left: 0px; right: 0px; height: 50px; background-color: orange; padding: .5em; text-align: center; }
  </style>
</head>
<body>
  <div id="header">HEAD</div>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempor gravida enim, id sollicitudin eros ullamcorper a. Cras vitae convallis dolor. Maecenas eget fermentum magna. Donec gravida neque vel sapien congue consequat. Nulla facilisi. Sed volutpat dui et nibh posuere, eu malesuada arcu congue. Cras vehicula elit eros, non tristique leo congue quis. Morbi aliquam scelerisque augue, eu sodales dolor. Integer a commodo nibh. </p>
  <div style="page-break-before: always;"></div>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempor gravida enim, id sollicitudin eros ullamcorper a. Cras vitae convallis dolor. Maecenas eget fermentum magna. Donec gravida neque vel sapien congue consequat. Nulla facilisi. Sed volutpat dui et nibh posuere, eu malesuada arcu congue. Cras vehicula elit eros, non tristique leo congue quis. Morbi aliquam scelerisque augue, eu sodales dolor. Integer a commodo nibh. </p>
</body>
</html>

Dompdf默认页眉标题内容重叠

1 个答案: