Question

我有一个表，每行有多行和多个边框。我可以选择在jquery插件print.js的帮助下打印页面。当我尝试打印时，<tr>正在破碎。有些部分在一页上，剩下的是在下一页。

<div id="printable_allagenda" style="display: none;" ></div>

Jquery：单击要打印的事件

$("#print_agenda").click(function(){

       $.ajax({
           type: "POST",   
           url: "module/parents/calendar/print_loader_tableview.php", 
           data: data_values,
           success: function(msg){ 
                $('#printable_allagenda').html(msg);
                $('#printable_allagenda').print();
           }
       }); 
       return false; 
    });

CSS：

@media print {
body{
    max-width:99%; 
     page-break-before: avoid; 
}
    #printable_allagenda{
        font-size: 12px;
    }
      table.gridtable {
        font-family: verdana,arial,sans-serif;
        font-size:11px;
        color:#333333;
        border-width: 1px;
        border-color: #666666;
        border-collapse: collapse;
    }
    table.gridtable th {
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #666666;
        background-color: #dedede;
    }
    table.gridtable td {
        border-width: 1px;
        padding: 8px;
        border-style: solid;
        border-color: #666666;
        background-color: #ffffff;
    }   
    @page {
    margin: 0.5cm;
    }
}
 table.gridtable {
    font-family: verdana,arial,sans-serif;
    font-size:11px;
    color:#333333;
    border-width: 1px;
    border-color: #666666;
    border-collapse: collapse;
}
table.gridtable th {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #666666;
    background-color: #dedede;
}
table.gridtable td {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #666666;
    background-color: #ffffff;
}
.fadedyes{
    position: absolute;top:0;left:0;width: 100%;height:100%;z-index:2;opacity:0.4;filter: alpha(opacity = 50);
}

我尝试使用此样式为表table.gridtable提供属性：page-break-inside: avoid;
还使用样式为table.gridtable tr的{{1}}样式，但它不起作用。

我附了一个屏幕截图。

Answer 1

对父元素使用float:none或display:block并制作page-break-before:always

分页符不起作用

1 个答案: