如何使用css在<td>中中断长单字?

请尝试以下操作:

word-wrap: break-word;
white-space: normal;

自动换行是CSS3(不过它在IE中工作)。但是,您可能无法让它在旧的浏览器中工作。

以下对我有效:

    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;

如果没有空格,请尝试以下代码作为break word。

word-wrap: break-word;
word-break: break-all;

td span{display:block;width:your_max_width_here.px}

<td><span>Pneumonoultramicroscopicsilicovolcanoconiosis</span></td>

尝试我的代码--

带桌体

table>tbody>tr>th{
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;
}

无桌体

table>tr>th{
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;
}

我尝试过在这里和其他页面找到不同的解决方案组合,但它从来没有像我预期的那样起作用——即使下面的行上有空间,而且看起来很愚蠢,这些简短的单词也会被拆分。

最后我找到了妥协:

table {
    table-layout: fixed;
    overflow-wrap: break-word;
    word-wrap: break-word; /* IE */
}

如果你想平等对待你的行,它的效果最好。

以下代码应该有效;

td {word-break: break-all}

我发现当你在单元格中混合了内容时,一些长的单字和其他短的字混合在一起,那就是 word-break: break-word; 效果最好。如果可能,它将在空白处中断。尽管IE11中似乎不支持这一点。如果将break all设置为上述任何一个属性,它将始终在一个单词内断开(除非它足够幸运地位于一个空格中)。