html - 你如何包装内容？

Question

我在   中有一些内容，但它没有正确包装。所以我唯一的解决方案是使用 word-break: break-all 但是它也会拆分单词。我猜   会像一封信一样被对待？那么，有没有办法以不同于字母的方式处理  ，这样它可以被打断，但单词本身不会被打断？

table{
  table-layout: fixed;
  border: 1pt solid;
}
.wrapme{
  white-space: wrap;
  word-wrap: break-word;
  word-break: break-all;
}

<div class="wrapme">
  <table>
    <tbody>
      <tr>
        <td>
          LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;
        </td>
      </tr>
    </tbody>
  </table>
</div>

请看这里https://jsfiddle.net/j6hpovbo/

  和 "" 之间的区别在 What's the difference between " " and " "? 中有解释。

Answer 1

在渲染之前转换你的数据。从外部源获取它后，只需执行字符串替换即可将   替换为实际空格。您可以在服务器端或客户端执行此操作。服务器端可能是最好的，但这里有一个基本的 JavaScript 解决方案:

var tds = document.querySelectorAll("td");
for (i = 0; i < tds.length; ++i) {
  tds[i].innerHTML = tds[i].innerHTML.replace(/&nbsp;/g, " ");
}

<table><tr><td>LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;LoremIspum&nbsp;
</td></tr></table>