Question

我正在使用fly-saucer库将xhtml转换为pdf。我在两页pdf之间的边界上遇到格式问题。如附带的屏幕截图所示，只要pdf中有页面更改，表示不同图例的颜色编码框就会被分割。这看起来不太好。附件是一个示例xhtml，其中包含生成pdf的代码示例。 xhtml正确显示，没有任何格式问题。有人遇到过类似的问题吗？对此有什么可行的解决方案？

XHTML输入文件

    <html xmlns="http://www.w3.org/1999/xhtml">
<head>

<style>


table.diff {
    font-family: Arial, Helvetica, sans-serif;
    color: #000000;
    font-size: 11px;
    border-collapse:collapse;
}
table.diff tbody {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
table.diff tbody th {
    font-family: Arial, Helvetica, sans-serif;
    background:#F5F5F5;
    font-size:11px;
    font-weight:normal;
    color:#999999;
    padding:.3em .5em .1em 2em;
    text-align:right;
    vertical-align:top;
}
table.diff thead {
    border-bottom:1px solid #BBC;
    background:#EFEFEF;
    font-family:Verdana;
}
table.diff thead th.texttitle {
    text-align:left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}

table.diff td {
    font-family: Arial, Helvetica, sans-serif;
    font-size:11px;
    padding: 2px 2px;
}

table.diff .empty {
    background-color:#D7F0FC;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
table.diff .replace {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    background-color:#FFD899;
}
table.diff .delete {
    background-color:#FF9900;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
table.diff .skip {
    background-color:#EFEFEF;
}
table.diff .insert {
    background-color:#ADCC70;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
table.diff th.author {
    text-align:right;
    border-top:1px solid #BBC;
    background:#EFEFEF;
}


.top-border {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-top: 1px solid #67BBE5;
}

table.diff .left-border {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-left: 1px solid #CCCCCC;
}

.bottom-border {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-left: 1px solid #67BBE5;
}

table.diff .left-bottom-border {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-left: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}

table.diff .bottom-border-grey {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border-bottom: 1px solid #CCCCCC;
}
table .top-border-line {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0px;
    border-top: 1px solid #CCCCCC;
}
table .bottom-border-line {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0px;
    border-bottom: 1px solid #CCCCCC;
}
table.diff .legend-border {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border: 1px solid #CCCCCC;
}

</style>

</head>


<body>

<div id='legends' class='legends' style='width:100%;float:left'>
        <table width="100%" class="diff" style="background-color: rgb(235, 235, 235); ">
            <tbody>
                <tr>
                    <td width="50%">
                    </td>
                    <td width="100%" style="">
                        <table cellspacing="0" cellpadding="1" width="100%" class="diff">
                            <tbody>
                                <tr>
                                <td style="width: 20%;"><b>Legend : </b></td>
                                <td style="text-align: center; width: 20%; border:1px solid;" class="empty">Empty</td>
                                <td style="text-align: center; width: 20%; border:1px solid;" class="delete">Deleted</td>
                                <td style="text-align: center; width: 20%; border:1px solid;" class="replace">Modified</td>
                                <td style="text-align: center; width: 20%; border:1px solid;" class="insert">Inserted</td>
                                </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>

    </body>

</html>

Image showing formatting issue in PDF

Answer 1

您可以尝试使用page-break-inside css属性控制分页符。

此属性由飞碟支持，但在所有情况下都很难正确使用，尤其是避免转角情况。

在我的模板中，我通常使用它：

tr{page-break-inside:avoid;}

另一种选择是使用page-break-before: always

强制分页所需

使用fly-saucer库格式化生成的pdf中的问题

1 个答案: