Css 拆分大字/防止拆分布局/断字符js

我已经看过并浏览了太多的页面来解释同一个问题，并且取得了各种各样的成功。我想做的是想出一种方法，我可以分解大词，这样它们就不会通过将内容拉伸到指定的宽度以外而分解table/divs/etc。我需要这是做一个百分比宽度元素。我觉得我已经尝试了一切，但必须有一个解决方案，即使它是一个黑客。到目前为止，我找到的最佳解决方案是使用。它适用于大多数长单词，但似乎只适用于可以在字典文件中找到的真实单词。例如，在我的所有示例中，这都被很好地分解了：

这是一个很长的字符串，如果使用连字号，它会很好地与连字号分离，一切都会好起来

这样的东西不会被破坏，反而会破坏我的网站：

阿巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴巴

=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-

我想使用它的大多数网站都允许用户创建的文本出现在网站上，像等号长字符串和连字符这样的东西很常见。我还注意到stackoverflow通过使用wrap:break单词来解决这个问题；css（至少在firefox中）。我对此进行了实验，发现它非常有效，但只在使用预定义像素宽度时有效，我需要一个使用百分比宽度的解决方案。我还使用了单词包装：打破所有的作品，但它看起来很丑陋，因为它在中间剪小字时，它应该包装字代替。

---

如果可能的话，我想继续使用连字号，因为它在大多数情况下都非常有效。也许我已经研究这个问题太久了，但是在断字器中是否有一些选项，我可以设置它来分解上面那些太大的非单词？也许有人已经成功地调整了连字号regex以实现这一点？

设置

wordwrap:break

对于百分比宽度也有效（从技术意义上讲），对于单元格/列具有百分比宽度的表来说，即使

表布局

已设置为

固定

，它似乎也会失败。为了解决这个问题，似乎有必要在内容中添加断行提示

旧的断行提示是

，但一些浏览器现在有问题。新的换行提示是零宽度空格字符，可以写成

​或类似（使用UTF-8时）；它在现代浏览器中运行良好，但对IE的旧版本造成了恶劣的影响。最近我倾向于投后者的票，但在我的主页上，我解释了一种“防弹”但笨拙的方法：使用CSS规则
。wbr:after{content:“\00200B”；}
。当您以编程方式生成页面时，这种笨拙的标记可能是可行的

您应该仅在需要时插入此类提示。它们不应用于自然语言中的单词。作为一种简单的方法，当处理用户输入以在页面上呈现时，可以将其拆分为技术意义上的“单词”（最大非空白字符串），然后，对于每个长度超过N个字符的“单词”，在任意K个字符后插入一个断行提示。需要根据布局选择参数N和K。缺点：这会导致“紧急中断”，就像字符串包含空格但不包含空格一样，而且这也会任意中断自然语言中的长单词

也许您可以在客户端执行操作，首先运行Hyphenator.js，然后处理文本内容，以便将文本内容拆分为任意空白和任意软连字符的片段（
\00AD
；您需要确保只有在Hyphenator.js完成其工作后才能执行此操作）。然后，您可以在片段上运行上述算法，即向长片段添加换行提示。
设置
换行：break
也适用于百分比宽度（从技术意义上讲），对于单元格/列具有百分比宽度的表，它似乎失败，即使
表布局
已设置为
固定
。为了解决这个问题，似乎有必要在内容中添加断行提示

旧的断行提示是
，但一些浏览器现在有问题。新的换行提示是零宽度空格字符，可以写成
​或类似（使用UTF-8时）；它在现代浏览器中运行良好，但对IE的旧版本造成了恶劣的影响。最近我倾向于投后者的票，但在我的主页上，我解释了一种“防弹”但笨拙的方法：使用CSS规则
。wbr:after{content:“\00200B”；}
。当您以编程方式生成页面时，这种笨拙的标记可能是可行的

您应该仅在需要时插入此类提示。它们不应用于自然语言中的单词。作为一种简单的方法，当处理用户输入以在页面上呈现时，可以将其拆分为技术意义上的“单词”（最大非空白字符串），然后，对于每个长度超过N个字符的“单词”，在任意K个字符后插入一个断行提示。需要根据布局选择参数N和K。缺点：这会导致“紧急中断”，就像字符串包含空格但不包含空格一样，而且这也会任意中断自然语言中的长单词

也许您可以在客户端进行操作，首先运行Hyphenator.js，然后处理文本内容，以便将文本内容拆分为任意空白和任意软连字符（
\00AD
；您需要确保仅在Hyphenator.js之后执行此操作