0

请看HTML代码：

<html>
<head>
<style type="text/css">
table {border-collapse: collapse; table-layout:fixed; width: 12cm}
table, td {border: solid 1px black}
</style>
</head>
<body>
<table>
<colgroup><col style="width: 33.3%"><col style="width: 33.3%"><col style="width: 33.3%"></colgroup>
<tr><td>ABCD_E_FGH_IJKL_MNOPQ</td><td>ABCD_E_FGH_IJKL_MNOPQ</td><td>ZZ_ABCD_E_FGH_IJKL_MNOPQ</td></tr>
<tr><td>ABCD_E_FGH_IJKL_MNOP</td><td>ABCD_E_FGH_IJKL_MNOP</td><td>ZZ_ABCD_E_FGH_IJKL_MNOP</td></tr>
<tr><td>ABCD_E_FGHI_JKLMN</td><td>ABCD_E_FGHI_JKLMN</td><td>ZZ_ABCD_E_FGHI_JKLMN</td></tr>
</table>
</body>
</html>

它产生以下输出：

没有硬换行的 HTML 文本依赖于空格

没有硬换行的 HTML 文本依赖于空格。我在单元格中没有空格，并且不得插入它们。这才是硬性要求！

我想成为这样的输出：

所需的 HTML 文本硬换行，即使没有空格

即使没有空格，如何变成换行文本？如果不可能，那么如何将下划线定义为空格？

4

2 回答 2

2

你可以使用分词：break-all; 关于 td 元素

创建了这个小提琴：https ://jsfiddle.net/quirksmode/bjs952kx/1/

td {
  word-break: break-all;
}
于 2021-02-18T09:47:42.613 回答
1

您需要再添加一个 css 属性 overflow-wrap: break-word。

所以你的css就像下面一样；

table, td {border: solid 1px black;overflow-wrap: break-word;}
于 2021-02-18T09:45:26.923 回答