17

現在、xhtmlrendererを使用して html を PDF に変換しています。次のように私のmavenの依存関係：

    <dependency>
        <groupId>org.mvel</groupId>
        <artifactId>mvel2</artifactId>
        <version>2.1.0.drools2</version>
        <scope>compile</scope>
        <optional>true</optional>
    </dependency>
    <dependency>
        <groupId>org.xhtmlrenderer</groupId>
        <artifactId>core-renderer</artifactId>
        <version>R8</version>
        <scope>compile</scope>
        <optional>true</optional>
    </dependency>
    <dependency>
        <groupId>com.lowagie</groupId>
        <artifactId>itext</artifactId>
        <version>2.0.8</version>
        <scope>compile</scope>
        <optional>true</optional>
    </dependency>

すべての PDF のページで表の見出しを繰り返そうとしています。そのため、css を使用します。

table {
        -fs-table-paginate: paginate;
    }`

CSS の説明はこちらです。

-fs-table-paginate

  • value とともに使用すると-fs-table-paginate: paginate、テーブル レイアウト アルゴリズムを変更して、後続のページでテーブル ヘッダーとフッターを繰り返し、ページをまたがるセルの外観を改善します (たとえば、境界線を閉じて再度開くことによって)。ただし、それだけです。表の最小幅がページよりも広い場合、切り落とされます。

  • 上記の css を追加すると、テーブルの境界線が切り離されます。

ここに画像の説明を入力

  • css を追加する前に、テーブルの境界線は単一の境界線に折りたたまれています。

ここに画像の説明を入力

table { -fs-table-paginate: paginate; }そのため、テーブルがborder-collapse:collapse無効になったと思います。

では、バグを修正し、テーブルの境界線を折りたたむにはどうすればよいでしょうか?

次のようにテーブルの私のアプリCSS

table{
    border:1px solid #000000;
    border-collapse:collapse;
    -fs-table-paginate: paginate;
}
table td{
    border:1px solid #000000;
    word-wrap:break-word;
    white-space:normal;
    overflow:hidden;
    text-align:left;
    line-height:16px;
    height:16px;

}
table tr{
    page-break-inside:avoid;
}
table thead tr th{
    background:#f2f2f2;
    border:1px solid #000000;
    text-align:center;
}

table tr th{
    background:#f2f2f2;
    border:1px solid #000000;
    text-align:center;
}

また、追加する-fs-table-paginate: paginate; と、テーブル ヘッダーが正常に表示されない場合があります。ヘッダーが正しく表示されません。また、テーブル ヘッダーの下に余分な空白行が追加されます。次のように： ここに画像の説明を入力

誰でも何か考えがありますか？

4

4 に答える 4

2

はい。それで合っています...

border-collapse: collapse と -fs-table-paginate: paginate を一緒に使用することはできません。-fs-table-paginate が paginate に設定されている場合、border-collapse は個別にリセットされます...

したがって、テーブルヘッダーを実装するより良い方法は、thead を使用することです...これは役立つかもしれません...

于 2012-05-13T07:03:23.860 に答える
1

私のために働いた回避策：

境界線を 0px に設定して、すべてthを1 つずつ初期化します。tdborder: 0px;

そして、次のように必要な場所に境界線を適用します:

<td style="border: 0px; border-left: 1px solid #ddd;">some texte</td>

もちろん-fs-table-paginate: paginate;テーブルスタイルも取り入れます。

作業サンプル html : https://gist.github.com/laguiz/5509461

結果は次のとおりです。

ここに画像の説明を入力

于 2013-05-03T14:34:19.123 に答える