我有同样的问题，但我需要显示多行(其中text-overflow:省略号;失败)。我解决它使用一个TD内的文本区域，然后样式它的行为像一个表格单元格。

    textarea {
        margin: 0;
        padding: 0;
        width: 100%;
        border: none;
        resize: none;

        /* Remove blinking cursor (text caret) */
        color: transparent;
        display: inline-block;
        text-shadow: 0 0 0 black; /* text color is set to transparent so use text shadow to draw the text */
        &:focus {
            outline: none;
        }
    }

我最近一直在研究它。检查这个jsFiddle测试，自己尝试改变基本表的宽度来检查行为)。

解决方案是将一个表嵌入到另一个表中:

<table style="width: 200px;border:0;border-collapse:collapse">
    <tbody>
        <tr>
            <td style="width: 100%;">
                <table style="width: 100%;border:0;border-collapse:collapse">
                    <tbody>
                        <tr>
                            <td>
                                <div style="position: relative;overflow:hidden">
                                    <p>&nbsp;</p>
                                    <p style="overflow:hidden;text-overflow: ellipsis;position: absolute; top: 0pt; left: 0pt;width:100%">This cells has more content</p>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td style="white-space:nowrap">Less content here</td>
        </tr>
    </tbody>
</table>

Fred现在对Celldito的扩张满意吗?

假定“表布局:固定”是基本的布局要求，这将创建均匀间隔的不可调整列，但您需要使单元格的百分比宽度不同，也许设置单元格的“colspan”为倍数?

例如，为了方便百分比计算，使用总宽度为100，并且假设您需要一个单元格为80%，另一个单元格为20%，考虑:

<TABLE width=100% style="table-layout:fixed;white-space:nowrap;overflow:hidden;">
     <tr>
          <td colspan=100>
               text across entire width of table
          </td>
     <tr>
          <td colspan=80>
               text in lefthand bigger cell
          </td>
          <td colspan=20>
               text in righthand smaller cell
          </td>
</TABLE>

当然，对于80%和20%的列，您可以将100%宽度的单元格colspan设置为5,80%宽度的单元格colspan设置为4,20%宽度的单元格colspan设置为1。

<table border="1" style="width: 100%;">
    <colgroup>
        <col width="100%" />
        <col width="0%" />
    </colgroup>
    <tr>
        <td style="white-space: nowrap; text-overflow:ellipsis; overflow: hidden; max-width:1px;">This cell has more content.This cell has more content.This cell has more content.This cell has more content.This cell has more content.This cell has more content.</td>
        <td style="white-space: nowrap;">Less content here.</td>
    </tr>
</table>

http://jsfiddle.net/7CURQ/

就像samplebias答案一样，如果Javascript是一个可接受的答案，我专门为此目的做了一个jQuery插件:https://github.com/marcogrcr/jquery-tableoverflow

要使用插件，只需输入

$('selector').tableoverflow();

完整示例:http://jsfiddle.net/Cw7TD/3/embedded/result/

编辑:

修复了jsfiddle的IE兼容性问题。 修复jsfiddle中更好的浏览器兼容性(Chrome, Firefox, IE8+)。

我有同样的问题，但我需要显示多行(其中text-overflow:省略号;失败)。我解决它使用一个TD内的文本区域，然后样式它的行为像一个表格单元格。

    textarea {
        margin: 0;
        padding: 0;
        width: 100%;
        border: none;
        resize: none;

        /* Remove blinking cursor (text caret) */
        color: transparent;
        display: inline-block;
        text-shadow: 0 0 0 black; /* text color is set to transparent so use text shadow to draw the text */
        &:focus {
            outline: none;
        }
    }