Javascript 如何使HTML表格的内容适合其单元格？

我有一个HTML表，它的内容有时不适合它们各自单元格的指定大小。在所有浏览器中，默认行为是使单元格垂直或水平展开以适合其内容。取而代之的是，我希望对内容进行视觉修剪，使其与单元格相匹配，如下所示：

我正在使用它，它允许用户按表中的任何字段对表进行排序。因此，绝对不要修剪实际内容，而是将其显示为已修剪过的内容，这一点非常重要

---

仅使用标准技术（CSS和JavaScript）如何做到这一点？

您可以为所有单元格设置宽度，并限制JavaScript中必须显示的特定字符数。例如，您使用

子字符串（0，15）

为超过15个字符的字符串设置JavaScript条件，并在字符串末尾添加“…”

---

我不知道这是否是最好的解决方案，但它应该会起作用。

有一个名为css的属性可以实现这一点

如果您将它与

空白：nowrap

结合使用，您就可以实现您的目标

下面是一个关于JSFIDLE的演示：

---

我不得不将td的内容包装在一个范围内，因为css属性由于某种原因无法在td上工作。

如果您要获得水平滚动，您可能需要进一步减小宽度或增加该单元格的高度…@Kenneth:抱歉，我说得不对。我的表有一个水平滚动条（我是这样设计的），但当我使用

表布局：fixed

时，它会被删除。您为您的表显示一个JSFIDLE示例如何？我的表有可排序的列，您提出的解决方案会弄乱排序。是的，在将

td

的内容包装到

span

中之后，它就像一个符咒！谢谢