打印HTML表格时，列宽丢失了

Question

我有一个仅用于打印的页面，需要进行样式设计。当我在浏览器中查看该页面时，列宽度与我设置的相同：

<table>
<col width="20%">
<col width="25%">
<col width="5%">
<col width="10%">
<col width="17%">
<col width="15%">
<col width="8%">
<thead>
      header columns
</thead>
<tbody>
      columns
</tbody>
</table>

然而，当我打印页面时，所有列的宽度都相同。我可以在打印时将列设置为百分比（或者可以吗）？

- Gregg B

Answer 1

尝试使用<table style="table-layout: fixed;">，这将强制表格使用指定的宽度。在历史上，表格列上的宽度一直更像是对浏览器的"建议"，在某种程度上更像是min-width。设置table-layout: fixed将绕过此限制。

- Niet the Dark Absol

---

似乎没有解决我的打印问题。列宽在屏幕上表现得很好，但打印时仍会使所有列宽相等。这只是我必须处理的事情吗？ - Gregg B

嗯...这可能是您的打印机驱动程序或其他与打印机相关的设置出了问题。当我尝试上述操作时，一切似乎都正常。 - Niet the Dark Absol

我目前遇到这个问题。这实际解决了问题吗？ - WhyEnBe

在基于Chromium的浏览器中，打印到PDF时我遇到了同样的问题。 - Liero

Answer 2

我已经尝试过以下打印输出：

document.getElementById("ColID").style.visibility="collapse"; 
document.getElementById("ColID").style.display="none"; 
document.getElementById("ColID").style.width="0px"; 
document.getElementById("ColID").style.width=0;

<TABLE BORDER="1">
<TABLE BORDER="1" STYLE="table-layout: fixed;">
<TABLE BORDER="1" STYLE="table-layout: auto;">

所有工作都在屏幕上完成，不涉及任何打印机驱动程序，使用基于Chromium的浏览器。

可以在Trident引擎下使用FireFox、Internet Explorer和旧版本的Edge。

- Mark Antony Agius