Answers:
换行TD文本
首先设置表样式
table{
table-layout: fixed;
}
然后设置TD风格
td{
word-wrap:break-word
}
white-space: normaltd样式才能使包装起作用（而不是word-wrap:break-word）
white-space:normal;
white-space: pre-wrap如果需要保留空白，请使用。
HTML表支持“ table-layout：fixed” css样式，可防止用户代理根据其内容调整列宽。您可能要使用它。
我相信您遇到过桌子的问题22。表格非常适合以表格形式将内容包装起来，它们在“拉伸”方面做得很出色，可以满足其中包含的内容的需求。
默认情况下，表格单元格将拉伸以适合内容……因此您的文本只会使其更宽。
有一些解决方案。
1.）您可以尝试在TD上设置最大宽度。
<td style="max-width:150px;">2）您可以尝试将文本放在包装元素（例如，跨度）中并对其设置约束。
<td><span style="max-width:150px;">Hello World...</span></td>请注意，尽管旧版本的IE不支持最小/最大宽度。
由于IE本身不支持最大宽度，因此如果要强制它，则需要添加一个hack。有多种添加hack的方法，这只是一种。
在页面加载时，仅对于IE6，获取表的呈现宽度（以像素为单位），然后获取该宽度的15％，并将其作为该列中第一个TD的宽度（或者，如果有标题则为TH）再次以像素为单位。
.tbl {
table-layout:fixed;
border-collapse: collapse;
background: #fff;
}
.tbl td {
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
}
使用word-break它无需样式table即可使用table-layout: fixed
table {
width: 140px;
border: 1px solid #bbb
}
.tdbreak {
word-break: break-all
}<p>without word-break</p>
<table>
<tr>
<td>LOOOOOOOOOOOOOOOOOOOOOOOOOOOOGGG</td>
</tr>
</table>
<p>with word-break</p>
<table>
<tr>
<td class="tdbreak">LOOOOOOOOOOOOOOOOOOOOOOOOOOOOOGGG</td>
</tr>
</table>这真的很好：
<td><div style = "width:80px; word-wrap: break-word"> your text </div></td> 您可以为所有都使用相同的宽度<div，或者在每种情况下都可以调整宽度以在需要的地方断开文本。
这样，您不必四处寻找固定的表格宽度或复杂的CSS。
要使单元格宽度与文本的最长单词完全相同，只需将单元格的宽度设置为 1px
即
td {
width: 1px;
}
这是实验性的，我在尝试和出错时就知道了
这可能可行，但在将来的某个时刻（如果不是立即）可能会造成一些麻烦。
<style>
tbody td span {display: inline-block;
width: 10em; /* this is the nuisance part, as you'll have to define a particular width, and I assume -without testing- that any percent widths would be relative to the containing `<td>`, not the `<tr>` or `<table>` */
overflow: hidden;
white-space: nowrap; }
</style>
...
<table>
<thead>...</thead>
<tfoot>...</tfoot>
<tbody>
<tr>
<td><span title="some text">some text</span></td> <td><span title="some more text">some more text</span></td> <td><span title="yet more text">yet more text</span></td>
</tr>
</tbody>
</table>
span正如其他人所指出的那样，的理由是，a <td>通常会扩展以容纳内容，而a <span>可以给定-并希望保持设置的宽度；的overflow: hidden打算，但可能不是，隐藏着怎样的否则会导致<td>扩大。
我建议使用titlespan 的属性来显示可视单元格中存在（或剪切）的文本，以便该文本仍然可用（如果您不希望/不需要人们看到它，那么为什么要拥有它首先，我想...）。
另外，如果您为td {...}td 定义了一个宽度，它将扩展（或可能缩小，但我对此表示怀疑）以填充其隐含宽度（如我所见，这似乎是table-width/number-of-cells），则似乎不会创建指定的表宽度同样的问题。
缺点是用于演示的其他标记。
实际上，文本换行自动发生在表格中。人们在测试时犯的错误是假设一个长字符串，例如“ ggggggggggggggggggggggggggggggggggggggggggg”，并抱怨说它没有包装。实际上，英语中没有这么长的单词，即使有单词，也很少会在其中使用它<td>。
尝试使用“预定条件下的对位是迷信”之类的句子进行测试。
将类应用于您的TD，应用适当的宽度（记住让其中一个不带宽度，以使其假定宽度的其余部分），然后应用适当的样式。将下面的代码复制并粘贴到编辑器中，然后在浏览器中查看其功能。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
td { vertical-align: top; }
.leftcolumn { background: #CCC; width: 20%; padding: 10px; }
.centercolumn { background: #999; padding: 10px; width: 15%; }
.rightcolumn { background: #666; padding: 10px; }
-->
</style>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="leftcolumn">This is the left column. It is set to 20% width.</td>
<td class="centercolumn">
<p>Hi,</p>
<p>I want to wrap a text that is added to the TD. I have tried with style="word-wrap: break-word;" width="15%". But the wrap is not happening. Is it mandatory to give 100% width ? But I have got other controls to display so only 15% width available.</p>
<p>Need help.</p>
<p>TIA.</p>
</td>
<td class="rightcolumn">This is the right column, it has no width so it assumes the remainder from the 15% and 20% assumed by the others. By default, if a width is applied and no white-space declarations are made, your text will automatically wrap.</td>
</tr>
</table>
</body>
</html><!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<table>
<tr>
<th>Poem</th>
<th>Poem</th>
</tr>
<tr>
<td nowrap>Never increase, beyond what is necessary, the number of entities required to explain anything</td>
<td>Never increase, beyond what is necessary, the number of entities required to explain anything</td>
</tr>
</table>
<p>The nowrap attribute is not supported in HTML5. Use CSS instead.</p>
</body>
</html>