假设我有一个文本，我想在HTML表格单元格中显示：
Honey Nut Cheerios, Wheat Chex, Grape-Nuts, Rice Krispies, Some random cereal with a very long name, Honey Bunches of Oats, Wheaties, Special K, Froot Loops, Apple Jacks
我希望这行文字能在逗号后面的位置断开。有没有一种方法可以告诉HTML渲染器尝试在指定位置断开，而不是在空格后面尝试断开，而不需要使用非断开空格？如果我使用非断开空格，则宽度无条件增大。如果换行算法首先尝试使用逗号并且不能使该行适合，则希望在空格之后发生换行。我尝试将文本片段包装在
<span>元素中，但那似乎没有任何有用的作用。<html>
<head>
<style type="text/css">
div.box { width: 180px; }
table, table td {
border: 1px solid;
border-collapse: collapse;
}
</style>
</head>
<body>
<div class="box">
<table>
<tr>
<td>lorem ipsum</td>
<td>lorem ipsum</td>
<td>lorem ipsum</td>
</tr>
<tr>
<td>lorem ipsum</td>
<td>
<span>Honey Nut Cheerios,</span>
<span>Wheat Chex,</span>
<span>Grape-Nuts,</span>
<span>Rice Krispies,</span>
<span>Some random cereal with a very long name,</span>
<span>Honey Bunches of Oats,</span>
<span>Wheaties,</span>
<span>Special K,</span>
<span>Froot Loops,</span>
<span>Apple Jacks</span>
</td>
<td>lorem ipsum</td>
</tr>
</table>
</div>
</body>
</html>
注意：看起来CSS3 text-wrap: avoid的行为是我想要的，但我似乎无法使其工作。
