只需将colspan设置为表中的列数。

所有其他的“捷径”都有陷阱。

最好的方法是在开始时将colspan设置为正确的数字。如果您的表有5列，则将其设置为colspan="5"，这是在所有场景中都有效的唯一方法。不，这不是一个过时的解决方案，也不是只推荐用于IE6之类的——这实际上是处理这个问题的最佳方式。

我不建议使用Javascript来解决这个问题，除非在运行时列的数量发生了变化。

如果列数是可变的，则需要计算列数，以便填充colspan。如果您的列数是可变的，那么无论生成表的是什么，都应该能够适应于计算表的列数。

正如其他答案所提到的，如果您的表没有设置为table-layout: fixed，您也可以将colspan设置为一个非常大的数字。但我发现这个解决方案很混乱，如果你稍后回来决定它应该是一个固定的表格布局，这可能会让你头疼。最好第一次就做对了。

就用这个吧:

colspan="100%"

它适用于Firefox 3.6, IE 7和Opera 11!(我猜在其他人身上，我无法尝试)

警告:正如下面评论中提到的，这实际上与colspan="100"相同。因此，这个解决方案将打破表与css table-layout:固定，或超过100列。

colspan="100%"

它的工作也在电子邮件outlook, gmail....

只是想补充我的经验并回答这个问题。 注意:它只在你有一个预定义的表和一个带有th的tr时有效，但是在你的行中动态加载(例如通过AJAX)。

在这种情况下，您可以计算第一个标题行中有th的数量，并使用它来张成整个列。

当您希望在没有找到结果的情况下转发消息时，可能需要此选项。

在jQuery中，table是你的输入表:

var trs = $(table).find("tr");
var numberColumns = 999;
if (trs.length === 1) {
    //Assume having one row means that there is a header
    var headerColumns = $(trs).find("th").length;
    if (headerColumns > 0) {
        numberColumns = headerColumns;
    }
}

如果您正在使用jQuery(或者不介意添加它)，这将比任何这些技巧更好地完成工作。

function getMaxColCount($table) {
    var maxCol = 0;

    $table.find('tr').each(function(i,o) {
        var colCount = 0;
        $(o).find('td:not(.maxcols),th:not(.maxcols)').each(function(i,oo) {
            var cc = Number($(oo).attr('colspan'));
            if (cc) {
                colCount += cc;
            } else {
                colCount += 1;
            }
        });
        if(colCount > maxCol) { 
            maxCol = colCount; 
        }
    });

    return maxCol;
}

为了简化实现，我装饰任何td/th我需要调整类，如“maxCol”，然后我可以做以下工作:

$('td.maxcols, th.maxcols').each(function(i,o) {
    $t = $($(o).parents('table')[0]); $(o).attr('colspan',  getMaxColCount($t));
});

如果你发现一个实现不适用，不要抨击答案，在评论中解释，如果它可以覆盖，我会更新。

下面是一个简洁的es6解决方案(类似于Rainbabba的答案，但没有jQuery)。

Array.from(document.querySelectorAll('[data-colspan-max]')).forEach(td => { let table = td; while (table && table.nodeName !== 'TABLE') table = table.parentNode; td.colSpan = Array.from(table.querySelector('tr').children).reduce((acc, child) => acc + child.colSpan, 0); }); html { font-family: Verdana; } tr > * { padding: 1rem; box-shadow: 0 0 8px gray inset; } <table> <thead> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</th> <th>Header 4</th> <th>Header 5</th> <th>Header 6</th> </tr> </thead> <tbod><tr> <td data-colspan-max>td will be set to full width</td> </tr></tbod> </table>