@media打印頁腳信息打印時相互重疊

我使用下列CSS創建一個頁腳：@media打印頁腳信息打印時相互重疊

@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和頁面2的頁腳，但它們彼此不重疊？

謝謝。

來源

2013-04-10 neo

你可以提供一個js小提琴嗎？ http://jsfiddle.net/ – 2013-04-10 16:26:40

也許你可以將其中一個不在中心。

來源

2013-04-10 16:56:34 Shashi

@media打印頁腳信息打印時相互重疊

回答

相關問題