HTML/CSS - 表分頁不工作（打印）

我已經嘗試了許多不同的表格元素的分頁規則，我已經用盡了自己。HTML/CSS - 表分頁不工作（打印）

項目地點： https://github.com/xremainnameless/lead_tracker

我試圖打印位於 '#lead_wrapper_u' DIV中 'leads_queue_u.php' 表。我使用'scripts/fill_all_leads_u.php'動態創建表格，並使用文檔上的自定義打印按鈕打印表格。

無論我應用了哪些css規則，我似乎都無法強制分頁。我刪除了所有的嘗試，以顯示更清晰的代碼。這裏是@print CSS的一個片段：

@media print { 
    @page {size: landscape;} 
    body * {visibility: hidden;} 
    #lead_wrapper_u, #lead_wrapper_u * {visibility: visible;} 
    #lead_wrapper_u button {visibility: hidden;} 
    #lead_wrapper_u { 
     position: absolute; 
     left: 0; 
     Top: 0; 
    } 
}

來源

2014-02-23 Will Davis

您是否嘗試過CSS屬性：page-break-after？ – 2014-02-23 02:58:03

@ AndrewSchools-是的，我有。除了正確的方式之外，我幾乎都以各種方式嘗試過頁面中斷，之前，之後等等。 –

我不認爲'page-break- *'規則可以在除Firefox以外的任何瀏覽器的表格上工作。 – toxalot

我一直建議不要使用瀏覽器的打印按鈕（Ctrl + P鍵）;因爲每個瀏覽器都有自己的偏好。您可以依賴其他框架將頁面打印成不同的格式。例如fpdf框架。但是，如果你堅持使用瀏覽器按鈕來打印，你可以用div來替換所有的表格;由於div始終在頁面的末尾中斷，不會使佈局變形。例如，如果你有這樣的代碼：

<table> 
    <tr> 
     <td>Name</td> 
    </tr> 
    <tr> 
     <td>City</td> 
    </tr> 
    <tr> 
     <td>DOB</td> 
    </tr> 
</table> 
. 
. 
.

然後，你有一個div來刪除表elemnts，更換，就像這樣：

<div style = "border:black solid;"> 
     <div style = "border:solid black;">Name</div> 
     <div style = "border:solid black;">City</div> 
     <div style = "border:solid black;">DOB</div> 
    </div> 
    . 
    . 
    .

這將確保每一個DIV將突破到下一頁，而不會看起來像被切割。

來源

2016-08-23 15:20:13 ASammour

HTML/CSS - 表分頁不工作（打印）

回答

相關問題