我在我的Java代码中使用飞碟PDF生成库将超文本标记语言模板转换为PDF。该模板由一个具有固定数量列的表组成。我希望每列具有固定宽度,并且其中的内容在溢出时隐藏。我为该任务编写了以下CSS-
.col1 {
width: 50px;
max-width: 50px;
min-width: 50px;
}
.col2 {
width: 70px;
max-width: 70px;
min-width: 70px;
}
.col3 {
width: 120px;
max-width: 120px;
min-width: 120px;
}
td, th {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
显然,如果内容在上面增长,这并没有限制列宽。模板在Chrome和火狐中看起来不错,但在生成的PDF中却没有。
有没有办法用飞碟PDF限制每列的宽度?
您可以将以下样式添加到表中:table-布局:固定
。
示例:
<html>
<head>
<style type="text/css">
.col1 {width: 50px;max-width:50px;min-width: 50px;}
.col2 {width: 70px;max-width: 70px;min-width: 70px;}
.col3 {width: 120px;max-width: 120px;min-width: 120px;}
table{table-layout:fixed;}
td, th {
border:1px solid red
overflow: hidden;
white-space: nowrap;
}
</style>
</head>
<body>
<table >
<thead>
<tr>
<td class="col1">Col1</td>
<td class="col2">Col2</td>
<td class="col3">Col3</td>
</tr>
</thead>
<tbody>
<tr>
<td class="col1">Lorem ipsum dolor sit amet, consectetur </td>
<td class="col2">la, molestie vel diam vitae, bibendum consequat enim. </td>
<td class="col3">s non metus. Donec auctor ipsum in quam bibendum, sit a</td>
</tr>
</tbody>
</table>
</body>
</html>