如何在HTML2PDF的两个文本之间添加虚线

Question

我正在尝试在我正在处理的文档的末尾创建一个定价概述。我想在左边的项目和右边的价格之间有一条虚线，非常像这样：

但是，这个索引是使用createIndex函数生成的，我没有源HTML。我从昨天开始尝试使用不同的HTML语法来使其工作，但这是不可能的。到目前为止我最好的尝试就是这个，但是我不能自动设置虚线的宽度：

<table style="width:100%;border-collapse: collapse;">
    <tr>
        <td style="width:40%;white-space:nowrap;">Item 1</td>
        <td style="border-bottom:dotted 1px black;width:45%;"></td>
        <td style="text-align:right;width:15%;white-space:nowrap;">Price 1€ HT</td>
    </tr>
</table>

我真的被困在这里，任何建议都会受到欢迎。

Answer 1

在这种情况下，您可以使用一点“黑客”。取消设置两个文本的宽度（解析为width: auto;）并将虚线容器的宽度设置为width: 99%;。为此，您还需要在文本元素上设置white-space: nowrap，但您已经这样做了。

<table style="width:100%;border-collapse: collapse;">
    <tr>
        <td style="white-space:nowrap;">Item 1</td>
        <td style="border-bottom:dotted 1px black;width:99%"></td>
        <td style="text-align:right;white-space:nowrap;">Price 1€ HT</td>
    </tr>
</table>