使 HTML 表格的列跨越所有列

Posted 2023-03-05

【中文标题】使 HTML 表格的列跨越所有列

【英文标题】：Make an HTML table's column span all the columns

【发布时间】：2013-11-01 20:49:57

【问题描述】：

我有一个 html 表格，CSS 属性 table-layout 设置为 fixed。

我希望表格中的一个单元格（特定行中的唯一单元格）跨越表格中的所有列，即填满表格的整个宽度。

当我使用时：

<td colspan = "0" id = "tdPager">

它适用于 FireFox v24 和 IE 9 及更高版本，但不适用于 Internet Explorer 8 或更低版本以及任何版本的 Chrome。

如何使列在所有浏览器中跨越整个表格宽度？

我已经尝试了所有方法——将 colspan 设置为值“*”、“100%”甚至比列总数还高，但它对所有浏览器都产生了可怕的影响。其余行中的所有列都变得非常薄。我无法将 colspan 设置为等于总列数的固定数字，因为列数是动态的。

【问题讨论】：

能否将 colspan 设置为表格中的列数？

Colspan all columns的可能重复

如果做不到这一点，您能否将 colspan 值设置为 32767 或其他一些难以置信的高数字？

请注意colspan="0" isn't currently allowed by the HTML spec。

你可以，虽然我可以想象这可能需要很多工作。 @PaulD.Waite：谢谢。那成功了。 :-)

【参考方案1】：

你把它设置为0是错误的。

您需要将colspan 设置为等于您在表格的任何行中拥有的最大列数。

因此，如果您的表格在第 5 行中有 6 列并且这是最多的，那么您将设置 colspan="6"。

如果列数是动态的，则需要动态设置colspan。

【参考方案2】：

您必须指定要跨越的列数，例如：clospan ="3"

【参考方案3】：

您可以为表格中不可用的那么多列设置最大可能的 no

如果您最多有 5 列，只需设置 colspan="6" 或更多。

【参考方案4】：

colspan="100%" 似乎在 IE 10、Firefox 26 和 Chrome 31 中运行良好。

【讨论】：

那是偶然的，因为它和colspan="100"是一样的。不要使用这个。

***.com/questions/398734/colspan-all-columns 进一步解释了这一点，并不总是与所有浏览器兼容...