3

我正在尝试将 html 转换为 pdf，但我面临的问题是 html 表格标签宽度设置不正确..

这是我的html

<table cellpadding='4' cellspacing='4' border='0' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle' width='100%'>
            <font face='Calibri' size='6' color='#FFFFFF'>Retail Natural Gas Deal Sheet</font>
        </td>
    </tr>
    <tr>
        <td colspan='2' width='100%'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>15RTLG7149</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Volumes (MMMBtu)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

这是我用来生成 pdf 的 c# 代码

        Document pdfDoc = new Document();
        //Document pdfDoc = new Document(PageSize.A4, 10f, 10f, 10f, 0f);
        //HTMLWorker htmlparser = new HTMLWorker(pdfDoc);
        using (MemoryStream memoryStream = new MemoryStream())
        {
            PdfWriter writer = PdfWriter.GetInstance(pdfDoc, memoryStream);
            pdfDoc.Open();
            XMLWorkerHelper.GetInstance().ParseXHtml(writer, pdfDoc, new StringReader(HTML));
            pdfDoc.Close();
            byte[] bytes = memoryStream.ToArray();
            memoryStream.Close();

            return bytes;
        }

但这就是它在 pdf 中呈现的方式..我找不到正确的答案..我需要帮助..提前谢谢..

http://i.stack.imgur.com/8WyBh.jpg

4

1 回答 1

3

我已将您的 HTML 复制粘贴到文本编辑器（Notepad++；在下面的屏幕截图中标记为 1）。我已经在浏览器中打开了这个 HTML（Chrome；在下面的屏幕截图中标记为 2）。我已将 HTML 转换为 PDF（使用 XML Worker；PDF 在下面的屏幕截图中标记为 3）。

在此处输入图像描述

当我将在浏览器中看到的内容与在 PDF 中看到的内容进行比较时，我的印象是 iText 的 XML Worker 做得很好。我在浏览器中看到的和我在 PDF 中看到的没有太大区别。

但是，当我查看您的 HTML 时，我发现不一致。您是否尝试过在浏览器中查看您的 HTML？它看起来不像你预期的那样，是吗？似乎问题不是由 iText 引起的，而是由您创建 HTML 的方式引起的。请告诉我们 HTML 在浏览器中的外观是否符合您的预期。如果不是，请解释您的期望。现在，很难理解这个问题，因为我在 PDF 中看到的内容与我在浏览器中看到的内容非常吻合。

更新：

在您的问题中，您没有添加任何边框（border='0'），很难理解您的意思。我现在添加了边框，因此 HTML 看起来像这样：

在此处输入图像描述

您希望 PDF 看起来像这样：

在此处输入图像描述

如果您像这样简化 HTML，这将非常容易：

<table cellpadding='4' cellspacing='4' border='1' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle'>
            <font face='Calibri' size='6' color='#FFFFFF'>XXXX XXXXX XXXXX</font>
        </td>
    </tr>
    <tr>
        <td colspan='2'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>XXXXXXXXXX</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Xxxxxxx (XXXXXXX)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

我改变了什么？我删除了width='100%'标签<td>中的colspan='2'. 这个信息是模棱两可的：你是说两列加起来应该占宽度的 100%。然而：

  • <table>您已经在您也拥有的标签中定义了它width='100%'，并且
  • 如果一个单元格有 colspan 2 并且你说这个单元格应该占宽度的 100%，那么就没有办法知道每列的宽度。放在那里没有意义width='100%'。

iTextSharp 根据可以找到宽度信息的第一行定义列的宽度。在这种情况下，此类信息的第一行宽度是具有 2 列的表中 colspan 2 的行。您将这 2 列的宽度定义为 100%，iTextSharp 将其解释为好像您想说每列占宽度的 50% (100% / 2)。

如果您删除此不明确的信息，iText 将根据第三行中定义的宽度（这是您所期望的）定义列的宽度。

于 2015-09-24T16:01:29.847 回答