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 - 表分页不工作（打印）

回答

相关问题