CSS to PDF, css trong Flying Saucer: kết quả -fs-table-paginate trong border-collapse: thu gọn không hợp lệ

Question

Bây giờ tôi đang sử dụng xhtmlrenderer để chuyển html sang PDF. maven dependcy tôi như sau:

<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> 

Tôi cố gắng để lặp lại người đứng đầu bảng trong page.So của mỗi PDF tôi sử dụng css : table { -fs-table-paginate: paginate; } .Công giải thích cho CSS là here.

-fs-table-paginate 

• khi được sử dụng với giá trị (fs-table-paginate) đánh số trang, làm thay đổi cách bố trí bảng thuật toán để lặp lại tiêu đề bảng và footer trên từng trang tiếp theo và cải thiện sự xuất hiện của các tế bào phá vỡ trên các trang (ví dụ: bằng cách đóng và mở lại các đường viền), nhưng đó là tất cả. Nếu chiều rộng tối thiểu của bảng là rộng hơn trang, bảng sẽ bị cắt nhỏ.

• Khi thêm css ở trên, đường viền của bảng được tách ra.

• Trước khi tôi thêm css, đường viền của bảng đang sụp đổ vào biên giới duy nhất.

Vì vậy, tôi nghĩ rằng table { -fs-table-paginate: paginate; làm bàn của tôi border-collapse:collapse không hợp lệ. Vì vậy, tôi có thể làm gì để sửa lỗi, làm cho đường viền của bảng bị sụp đổ?

ứng dụng CSS của tôi cho bảng như sau

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; 
} 

Và khi thêm -fs-table-paginate: paginate; đôi khi tiêu đề bảng sẽ không normal.The tiêu đề sẽ không được hiển thị một cách chính xác. Và bên dưới tiêu đề bảng sẽ tăng thêm dòng trống bổ sung. Như sau:

Bất kỳ ai biết ý tưởng?

Answer 1

Có ... bạn là chính xác ...

border-collapse: sự sụp đổ và fs-table-paginate: paginate không thể sử dụng với nhau. border-collapse được thiết lập lại để tách khi-fs-table-paginate được thiết lập để paginate ...

Vì vậy, cách tốt hơn để thực hiện tiêu đề bảng của bạn là sử dụng thead ... this may help u ...

Answer 2

đối với cùng một vấn đề, tôi đã sử dụng workaround này:

table { 
    -fs-table-paginate: paginate; 
    border-spacing: 0; 
} 

Nó làm việc cho tôi, thead tôi được lặp lại trên mỗi trang.

Answer 3

Giải pháp mà làm việc cho tôi:

Init tất cả th và td từng người một với bộ biên giới để 0px: border: 0px;

Và sau đó áp dụng biên giới, nơi bạn cần đến chúng như thế này:

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

Tất nhiên tôi để cho -fs-table-paginate: paginate; theo kiểu bảng.

Làm việc mẫu html: https://gist.github.com/laguiz/5509461

Dưới đây là kết quả: