添加頁腳以打印網頁並設置頁邊距

我想將頁腳添加到HTML頁面，該頁面將在打印時在所有頁面上重複。我已設法通過這個代碼來實現這一點：添加頁腳以打印網頁並設置頁邊距

@media print { 
    p.note { 
     bottom: 0; position: fixed; 
    } 
}

但現在我有這個款會在複印件 enter image description here

根據本Mirosoft article其餘頂部的問題，這應該工作了我：

@page :first { 
    margin-bottom: 4in; 
}

但它沒有，它不會改變任何想法？

2011-09-16 Reina

這裏是一個工作的解決方案，CSS是這樣的：

@media print { 
    p.note { 
     display:block; 
     bottom:0; 
     position:fixed; 
     font-size:11px; 
    } 
}

一切都需要包含在一個單獨的div與這個CSS

#wrapper { 
    position:relative; 
    bottom:1in; 
    margin-top:1in; 
    width:974px; 
    margin:0 auto; 
}

這工作完美！

2011-10-02 23:05:37 Reina

如何添加一些z-index？看來，頁腳覆蓋末段也可以嘗試使用

@media print { 
    p.note { 
     bottom: 0; position: fixed; 
margin-top:10px; 
    } 
}

2011-09-16 02:18:19 Theodore

這不是重寫它，它坐在它的頂部，因爲它位於頂部，您的答案不會幫助不幸 – Reina

確保爲主要內容的容器，使房間頁腳。舉例來說，如果您的標記看起來是這樣的：

<div id="content"><p>Lorem Ipsum Latin et cetera</p></div> 
<p class="note">Footer</p>

你會想一些CSS是這樣的：

#content {margin-bottom:4in}

2011-09-16 03:59:58

有1個容器div包含多個頁面，我不控制其中的東西數量，這一切都是動態的... – Reina

無論使用何種特定標記，您都需要在頁腳的底部留出空間 - 這就是爲什麼它放在您的內容上。對於這種情況，我經常把所有內容都放在'

content here

'中。 –

回答