html - CSS 在逗号上打断单词

Question

我想用逗号而不是空格来打断单词

我已经看到了包括添加 <wbr> 在内的解决方案标记到您的 HTML，但是，对于动态信息，现在我需要另一个脚本将其插入到 HTML 文本中，如果用户没有启用 JS，它对我来说并没有多大用处。

截至目前，我正在使用以下组合:

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

它是一个不错的解决方案，但是，我发现的这两个解决方案(https://stackoverflow.com/a/15137272/1887101；break long-no-spaces-lines on commas, dots, hyphens or other special chars)已经超过 3 年了 - 所以我想知道是否有更新的解决方案可用于此问题？

示例字符串:

C31C636363-Thermal,80mm, ReStick,Serial,A/C,PSIncluded,EDG

样本中断:

C31C636363-Thermal,80mm, ReStick,

Serial,A/C,PSIncluded,EDG

Answer 1

I am trying to break a word based on commas instead of spaces

你不能。 CSS 不支持那个。打破空格是硬连线的。

您别无选择，只能使用 JS 预处理您的内容，以便在逗号后插入零宽度空格，或者在服务器端执行此操作。