在表格中使用“换行：断字”

可能重复：
在html表中换行

这段文字的行为与我在Google Chrome（以及其他现代浏览器）上所需的方式完全相同：

<div style="border: 1px solid black; width:100%; word-wrap: break-word;"> <p> aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb </p> </div> 

1. 当浏览器足够宽时，+和b +在同一行上。

    aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

2. 缩小浏览器的范围时，a +和b +分别放在不同的行上。

    aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

3. 当b +不能再适合的时候，它被打破并且放在两条线上（总共三条线）。

    aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbb bbbbbbbb 

这很好。

然而在我的情况下，这不是一个div而是一个table ，就像这样：

 <table style="border:1px solid black; width:100%; word-wrap:break-word;"> <tr> <td> <p> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb </p> </td> </tr> </table> 

在这种情况下，＃1和＃2发生，但不是＃3。 也就是说，表格在步骤2之后停止缩小并且从未发生过步骤3。 破解词似乎没有被滤掉。

有谁知道如何使＃3发生？ 该解决scheme只需要在Chrome中工作，但它也可以在其他浏览器中工作，甚至更好。

PS“不要使用表”是没有用的。

Answer 1

table-layout: fixed会强制单元格适合表格（而不是其他方式），例如：

 <table style="border: 1px solid black; width: 100%; word-wrap:break-word; table-layout: fixed;"> <tr> <td> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb </td> </tr> </table> 

Answer 2

你可以试试这个：

td p {word-break:break-all;}

但是，如果有足够的空间，除非添加了<br>标记，否则这会显示为：

 aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

所以，如果可能的话，我会build议在有新行的地方添加<br>标签。

 aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

http://jsfiddle.net/LLyH3/3/

另外，如果这不能解决你的问题，这里有一个类似的线程。