让 phantomjs 1.9.8 在 PDF 中正确呈现 HTML 表格单元格的边框

【问题标题】：Getting phantomjs 1.9.8 to render borders round HTML table cells in PDF correctly让 phantomjs 1.9.8 在 PDF 中正确呈现 HTML 表格单元格的边框
【发布时间】：2015-09-24 14:21:45
【问题描述】：

使用 phantomjs 将带有边框的表格呈现为 PDF 会使每个单独的单元格有边框，但每个单元格之间有间隙。表格在网页上正确显示，没有这样的间隙。

在我的 CSS 中我尝试过设置：

border-collapse: collapse;
border-spacing: 0px 0px;

无济于事，我需要消除 PDF 中单元格之间的那些空白。任何想法将不胜感激。你的艾伦

【问题讨论】：

标签： pdf phantomjs html-table

【解决方案1】：

确保将border-spacing 和border-collapse 规则添加到<table> 而不是<td>。这是我的 phantomjs 特定规则：

.table {
    border: 1px solid black;
    border-spacing: 0px 0px;
    border-collapse: collapse;
}

.table th,
.table td {
    padding: 5px;
    border: 1px solid black;
    margin: 0;
}

请注意，这与“普通”（不是 phantomjs-pdf）css 有点不同，您的边框折叠可以位于 <td> 元素上。

【讨论】：

感谢 border-collapse: collapse; 在“表”级别成功了。