td中自动换行，设置两次就就无法实现

Posted 2023-05-01

<tr>
<td style="word-break: break-word;" width="30"><a href="">测试文字2行1列下水电费水电费水电费水电费水电费</a></td>
<td><a href="" style="float: right;">测试文字2行2列下是电风扇的发生的发生地方撒旦法师</a></td>
</tr>
只设置一个就可以换行

<tr>
<td style="word-break: break-word;" width="30"><a href="">测试文字2行1列下水电费水电费水电费水电费水电费</a></td>
<td style="word-break: break-word;" width="30"><a href="" style="float: right;">测试文字2行2列下是电风扇的发生的发生地方撒旦法师</a></td>
</tr>

如果两个都设置就都不能换行
这是为什么

参考技术A

原因是你第二行的第二个单元格设置了宽度，把宽度去掉就可以了。因为第一行你第二个单元格没设置.

删除效果如下：

本回答被提问者和网友采纳

table中td中内容如何实现自动换行

1、 页面中设置table宽度，一般如果字符串长度超过设置的单元格宽度后 会自动换行。但是如果字符串中没有空格以及标点符号它不会自动换行的。 字符串已经超过设置的单元格宽度 但是就是没有换行。如果字符串中有空格或者标点符号就可以。汉字组成的字符可以实现自动换行就算没有任何符号空格都行。如果纯字母组成的字符串就不行 2 下面这种情况也是 使用上面的代码调整过来的。 页面table中一行两列，但是虽然设置了左边td的宽度，但是丝毫不起作用。设置右边td的宽度亦如此，但是在table中加上上面加粗红色属性即可 参考技术A 1.（IE支持）
关键词：table-layout: fixed 及 word-wrap: break-word
<table style="table-layout:fixed" width="200" bgcolor="#f7f7f7">
//是否自动换行
<tr>
<td style="word-wrap:break-word"> //一个很长的单词遇到换行要拆开
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA </td>
</tr>
</table>

2.（Firefox 或其他浏览器支持）
/* Browser specific (not valid) styles to make preformatted text wrap */
pre
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */

3.（Firefox支持）
<td><script language="javascript" type="text/javascript" defer="defer">javascript:(function()var D=document; F(D.body); function F(n)var u,r,c,x; if(n.nodeType==3) u=n.data.search(/\S/); if(u>=0) r=n.splitText(u+10); n.parentNode.insertBefore(D.createElement("WBR"),r); else if(n.tagName!="STYLE" && n.tagName!="SCRIPT")for (c=0;x=n.childNodes[c];++c) )();</script></td>