<table style="table-layout: fixed; max-width: 100%;">
    <tr>
        <td>
             <div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap">This cells has more content</div>
        </td>
        <td>Less content here</td>
    </tr>
</table>

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

要使用插件，只需输入

$('selector').tableoverflow();

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

编辑:

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

你可以试着“加权”某些列，像这样:

<table border="1" style="width: 100%;">
    <colgroup>
        <col width="80%" />
        <col width="20%" />
    </colgroup>
    <tr>
        <td>This cell has more content.</td>
        <td>Less content here.</td>
    </tr>
</table>

您还可以尝试一些更有趣的调整，如使用0%宽度的列和使用一些组合的白色空间CSS属性。

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

你懂的。

不知道这是否对任何人都有帮助，但我通过为每列指定特定的宽度大小来解决类似的问题。显然，如果每个列的内容宽度变化不太大，那么效果最好。

有一个更简单、更优雅的解决方案。

在你想要应用截断的表格单元格中，只需包含一个带有css table-layout: fixed的容器div。这个容器获取父表单元格的全部宽度，因此它甚至可以响应。

确保对表中的元素应用截断。

工作在IE8+

<table>
  <tr>
    <td>
     <div class="truncate">
       <h1 class="truncated">I'm getting truncated because I'm way too long to fit</h1>
     </div>
    </td>
    <td class="some-width">
       I'm just text
    </td>
  </tr>
</table>

和css:

    .truncate {
      display: table;
      table-layout: fixed;
      width: 100%;
    }

    h1.truncated {
      overflow-x: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

这是一个工作提琴 https://jsfiddle.net/d0xhz8tb/

Yep I would say thirtydot has it, there is no way to do it unless you use a js method. You are talking about a complex set of rendering conditions that you will have to define. e.g. what happens when both cells are getting too big for their apartments you will have to decide who has priority or simply just give them a percentage of the area and if they are overfull they will both take up that area and only if one has whitespace will you stretch your legs in the other cell, either way there is no way to do it with css. Although there are some pretty funky things people do with css that I have not thought of. I really doubt you can do this though.