4

在 C# 中，我使用 IronPDF 从 MYSQL 数据库中的数据创建 PDF。对于布局，我使用表格并使用单独的 CSS 文件对其进行设计。

当我在dreamweaver 或浏览器中尝试生成的HTML 和CSS 时，一切正常。当我在 IronPDF 中尝试时，生成的 PDF 中的表格边框不显示，并且表格中的 textalignment 是错误的。

有人知道这是怎么回事吗？IronPDF 中有什么东西会导致这个问题吗？

HTML：

<html>
<head>
<meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="test.css"/>
<title>test</title>
</head>

<body>
<div id="page"<img src="C:\Dump\SmallLogoBW.png" id="logo" width="250" height="151"/><div class="klantcontact"<h1>Offerte</h1><p>Name</p><p>Address<p><p>Address<p></div><table class="factuurgegevens"><tr><th width="100">Offertenummer:</th><th width="100">2018-018</th><th width="100">BTW-nummer:</th><th width="100"></th></tr><tr><th width="100">Offertedatum:</th><th width="100">06/12/2018</th></tr><tr><th width="100">Vervaldatum:</th><th width="100">26/12/2018</th></tr></table><table id="factuur"><tr id="header"><th class="col1">Omschrijving:<th><th colspan="2">asfd</th><th>Bedrag</th></tr><tr><td></td></tr><tr><td id="col1">Prestatie 1</td><td colspan="2">sdf</td><td class="bedrag">546</td></tr><tr></tr><tr></tr><tr><td></td><td>Project: </td></tr><tr><td colspan="3">BTW-Verlegd (Belasting te voldoen door de medecontractant, KB nr. 1, Art. 20).</td><td class="bedrag"></td></tr></table><div class="factuurvoorwaarden"><p><h2>Factuurvoorwaarden:</h2>Elke niet betaalde factuur brengt van rechtswege en zonder aanmaning een intrest op van 12% per jaar.Wanneer een factuur onbetaald blijft gedurende acht kalenderdagen na de aangetekende verzending van aanmaning, zal de schuldbovendien verhoogd 
worden met 10% van het factuurbedrag, met een minimum van 50,00 euro. Dit geldt als forfaitaireschadevergoeding voor andere onkosten dan het renteverlies en de eigenlijke gerechtskosten. Klachten betreffende de geleverdegoederen en/of diensten worden enkel aanvaard wanneer zij schriftelijk gebeuren binnen 15 kalenderdagen na facturatiedatum van deverrichting. Indien geen betwisting de verlener bereikt, wordt verondersteld dat de klant akkoord gaat met de gefactureerde goederenen/of diensten. In geval van betwisting is het Belgische Recht van toepassing en zal het geschil worden voorgelegd aan de rechtbankenvan het arrondissement Turnhout.</p></div></div>

CSS：

#page {
width: 21cm 29.7cm;
margin: 27mm 16mm 27mm 16mm;
}

#logo
{
float: left;
}

.klantcontact {
float: right;
text-align: right;
}

table{
width: 100%;
}

#header
{
border-bottom: 1px solid #000;
}

#factuur td
{
text-align: left;
width: 25%;
}

.factuurgegevens {
border-top: double;
border-bottom: double;
margin-bottom: 1em;
}

#factuur {
border: 1px solid #000;
height: 30%;
}

#factuur th    {
border-bottom: 1px solid #000;
text-align: left;
width: 30%;
}

.col1
{
width: 10%;
}

.bedrag {
border-left: 1px solid #000;
}
4

3 回答 3

1

Ironpdf 仅接受内联 CSS，因此外部 CSS 不起作用。因此，请避免在 HTML 代码中使用类。还可以使用谷歌浏览器检查您的表格布局，因为 Ironpdf 会像谷歌浏览器一样渲染布局。你的代码应该像

<!DOCTYPE html>
<html>
<body>
<h2>Basic HTML Table</h2>
<table style="width:100% ; border: 1px solid black ; border-collapse: collapse; ">
  <tr style=" border: 1px solid black ; border-collapse: collapse ">
    <th style=" border: 1px solid black ; border-collapse: collapse ">Firstname</th>
    <th style=" border: 1px solid black ; border-collapse: collapse ">Lastname</th> 
    <th>Age</th>
  </tr>
  <tr style=" border: 1px solid black ; border-collapse: collapse ">
    <td style=" border: 1px solid black ; border-collapse: collapse ">Jill</td>
    <td style=" border: 1px solid black ; border-collapse: collapse ">Smith</td>
    <td style=" border: 1px solid black ; border-collapse: collapse ">50</td>
  </tr>  
</table>
</body>
</html>
于 2019-05-20T15:04:21.897 回答
1

这个问题很旧，但这可能对其他人有所帮助。正如之前的答案所指出的，Ironpdf 不支持来自文件的外部 css（尽管它确实支持来自 urls 的外部 css ..）

因此，理想情况下，您在渲染器的同一个 html 文档中提供 css。这可以内联或在 html 头中完成，我更喜欢 html 头选项，如下所示

<!DOCTYPE html>
<html>
    <head>
        <style>
            table{
                width:100%;
                border: 1px solid black;
                border-collapse: collapse; 
            }
            tr, th, td{
                border: 1px solid black;
                border-collapse: collapse;
            }
        </style>
    </head>
    <body>
    <h2>Basic HTML Table</h2>
        <table>
            <tr>
                <th>Firstname</th>
                <th>Lastname</th> 
                <th>Age</th>
            </tr>
            <tr>
                <td>Jill</td>
                <td>Smith</td>
                <td>50</td>
            </tr>  
        </table>
    </body>
</html>

这会留下一个更干净的 html 文件并适用于当前版本的 ironpdf

于 2020-03-04T14:37:10.293 回答
1

更新：

IronPDF 完全支持 CSS3 和表格。自 2021.9 版以来，它 100% 兼容 Chrome 2021

https://www.nuget.org/packages/IronPdf/

于 2021-10-01T08:55:30.010 回答