问@media打印页脚信息相互重叠
EN

Stack Overflow用户

提问于 2013-04-11 00:23:15

回答 1查看 916关注 0票数 2

我正在使用以下css在打印时创建页脚：

@media all {
   .page-break  { display: none; }
   .footer {display: none; }    
}

@media print {
   .page-break  { display: block; page-break-before: always; }
  .footer {display: block; position: fixed; bottom: 0; text-align: center; width:100%;}  
}

在html中，我有类似于：

<body>
  ...
  ...
 <div class='footer'>Page Number: 1</div>
 <div class='page-break'></div>
 ...
 ...
 <div class='footer'>Page Number: 2</div>
 <div class='page-break'></div>
 ...

</body>

现在的问题是，在打印视图中，第1页和第2页的页脚，它们的内容相互重叠。

我知道这是由css "position: fixed；bottom 0“引起的。我的问题是:如何使页面1和页面2的页脚在打印视图中仍然显示在页面1和page2的底部，但它们不会相互重叠？

谢谢。

css

html

回答 1

Stack Overflow用户

发布于 2013-04-11 00:56:34

也许你可以把他们中的一个放在中间。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/15931310

复制

相似问题

问@media打印页脚信息相互重叠
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问@media打印页脚信息相互重叠EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问@media打印页脚信息相互重叠
EN