html - 在表格中显示大文本的最佳方法？

Question

---

我有一个表格来显示/编辑我网站的用户详细信息。每个用户一行。我为每个用户提供了 300 个字母的评论。但是正确显示注释在表格中占用了太多空间。我可能需要使用 javascript 来显示/隐藏评论。显示评论的最佳方式是什么？它需要是可编辑的，所以可能必须是一个 teaxtarea 标签。

请注意，这是一个设计原则问题，而不是技术问题。我需要以专业的方式显示大型评论部分。

Answer 1

首先，将表格设置为您认真考虑的任何宽度：table-layout:fixed在表格元素上设置。

然后，为“comment”列设置一个确定的宽度。最简单的方法是使用设置（按优先顺序<colgroup><col /><col />...</colgroup>将其放在您的<thead>或<tbody>first之前）。<tr>

除了在“comment”列上设置宽度外，还可以添加以下样式：

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

这将自动将文本截断为适合您的大小。

接下来你需要能够展示整个事情。您可以做的是让一个onclick事件将文本替换为包含文本的文本区域。这很简单，只需基本的 DOM 操作。

Answer 2

我决定使用具有 3 行和 300px 宽度的 textarea 并带有溢出：自动，以便在文本较大时可以滚动，但可以很好地适应表格。