让TD单元格内的超长文字换行显示不影响表格整体效果

最新推荐文章于 2024-12-25 08:52:23 发布

原创最新推荐文章于 2024-12-25 08:52:23 发布 · 1.7k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #表格美观

web前端专栏收录该内容

16 篇文章

订阅专栏

本文介绍了一种在HTML或JSP中处理表格内超长文本的方法，通过设置TD样式属性，实现文本自动换行，避免表格因文本过长而变形。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在前端编辑JSP或HTML的table表格的时候，有时候会遇一些超长的文本，它们显示在td之中，如果不设置默认换行，通常这些文本会把表格撑得很大很大，影响美观了，那么我们能不能设置一下单元格TD 让其中的文本内容在超过默认长度的时候，变成自动换行呢？当然是可以的，参考一下如下代码所示：

<td  colspan="3"style="word-wrap:break-word;word-break:break-all;">超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......超长的文本......</td>

那么显示效果如下

发现单元格没有被超长的文本撑得变形，符合预期。