在打印的特定頁面的底部創建一個div

我有一個具有可變行數的表格。我想通過瀏覽器打印該表格。在它下面，有一個div應該保留在頁面的底部。如果表格包含在第一頁中，div將位於第一頁的底部。如果表溢出到第二頁，那麼div會成爲第二個頁面的底部，等等，... 我的第一種方法是像我以前在HTML在打印的特定頁面的底部創建一個div

.footer{ 
    width: 100%; 
     position: absolute; 
     bottom: 0; 
     font-size: 10pt; 
}

這做處理呢不管用。頁腳仍保留在第一頁上。需要你的幫助，請！

編輯

我所做的表和頁腳在父DIV，使他們能夠循環。頁腳將始終與表格的末尾位於同一頁面上。對不起，我的不準確！

解決將帖子

我終於被周圍的另一個DIV頁腳和做一些CSS如下使它：

.table{ 
     min-height: 20cm !important;/* Define height for the table in cm or mm (I encountered a problem with px and %) */ 
     display: block; 
     position: relative; 
     width: 100% !important; 
    } 
    .footer{ 
     width: 100%; 
     position: relative; 
     margin-bottom: 0 !important; 
     font-size: 10pt; 
     page-break-inside: avoid !important; 
     page-break-before: auto !important; /* this pushes the footer to the bottom of next page if table overflows to another page */ 
    }

唯一剩下的問題是，當表完全一致的第一頁：頁腳被推到下一頁，但顯示在頂部:( 謝謝你所有的答案傢伙！:)

來源

2016-06-09 Knighto05

嘗試使用position: fixed;到這個div。

它應該放在打印頁面的底部，如果你設置了bottom: 0;

來源

2016-06-09 12:09:11 dolu92

你」對了，但我忘了提及桌子和div循環！如果我將div設置爲固定的，它將在文檔的末尾與表的末尾不在同一頁。 – Knighto05

不，如果您將div設置爲固定，它將在所有頁面的底部重複。但是，就我所知，您希望清除表格的其餘部分，然後在此頁面的底部打開頁腳？在那之後，下一頁是以新表開始的，它跨越了3頁，因此3頁還有下一頁頁腳？如我錯了請糾正我。 – dolu92

是的，你懂了！我嘗試了'position：fixed;'，它在第一次迭代中就像一個魅力一樣，但是後來每一頁都出現了頁腳，直到最後。我不知道爲什麼！ – Knighto05

我讓我的頁腳粘在div的底部並遵循它。

如果我理解正確的話，你想要的頁腳是在表的末尾，這裏是我是如何做的：

#footer { 

    background-color: #333; 
    clear:both; 
    bottom: 0; 
    width: 1200px; 
    height: 50px; 
    margin: 0 auto; 
    border-radius:0px 0px 10px 10px; 
}

和頁腳裏面的paragraf：

#paragraf_1 { 
     display:block; 
    color:white; 
    text-align:bottom-left; 
    padding:14px 16px; 
    text-decoration:none; 
}

來源

2016-06-09 12:23:14

在打印的特定頁面的底部創建一個div

回答

相關問題