可能是重复问题:
HTML表格中的自动换行
在Google Chrome(以及其他现代浏览器)中,此文本表现出我想要的效果:
<div style="border: 1px solid black; width:100%; word-wrap: break-word;">
<p>
aaaaaaaaaaaaaaaa
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
</p>
</div>
当浏览器宽度足够时,a+和b+会在同一行显示。
aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
当你缩小浏览器窗口时,a+和b+会被放在不同的行上。aaaaaaaaaaaaaaaa
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
当 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步永远不会发生。break-word似乎没有过滤掉。有人知道如何让#3发生吗?解决方案只需要在Chrome中工作,但如果它在其他浏览器中也能工作,那就更好了。
附言:"不要使用表格"没有帮助。