【发布时间】:2013-10-14 22:48:27
【问题描述】:
我在从 dompdf 创建 pdf 时遇到了小问题。在html页面页眉位置:固定内容重叠在页眉上。页面内容是动态加载的。如何清除内容重叠问题。html版像这个链接html
【问题讨论】:
我在从 dompdf 创建 pdf 时遇到了小问题。在html页面页眉位置:固定内容重叠在页眉上。页面内容是动态加载的。如何清除内容重叠问题。html版像这个链接html
【问题讨论】:
定位的内容当前根据主要内容容器或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>
【讨论】: