elysia长串英文自动换行的最终解决方案

2021年1月22日发(作者：blouse怎么读)
长英文自动换行的最终解决方法：

在
table
标签中加入
style=
wrap: break-
word;table-layout: fixed;
word- break:break-all

如果可以了，就不用向下看下了。

word-
wrap
同
word-
break
的区别

word-
wrap:
normal Default. Content exceeds the boundaries of its container.

break-
word Content wraps to next line, and a word-break occurs when necessary.
必要时会
触发
word-break
。

word- break:

normal Default. Allows line breaking within words.
好像是只对
Asian text
起作用。

break-all Behaves the sam
e as normal for Asian text, yet allows the line to break arbitrarily
for non-Asian text. This value is suited to Asian text that contains
some excerpts
of non-Asian
text.
keep-all Does not allow word breaking for Chinese, Japanese, and Korean. Functions the
same
way as normal for
all non-Asian languages. This value is optimized for text
that includes
small amounts of Chinese, Japanese, or Korean.
总结如下：


word-
wrap
是控制换行的。

使用
break-
word
时，是将强制换行。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就
不起作用。

break-
word
是控制是否断词的。

normal
是默认情况，英文单词不被拆开。

break- all
，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。


keep-all
，是指
Chinese, Japanese, and Korean
不断词。即只用此时，不用
word- wrap
，中文就不
会换行了。（英文语句正常。）


ie
下：

使用
word-
wrap:break- word;
所有的都正常。

ff
下：


如这< br>2
个都不用的话，中文不会出任何问题。英文语句也不会出问题。但是，长串英文会出问题。

为了解决长串英文，一般用
word-
wrap:break- word;
word-break:break-
all;
。但是，此方式会导致，< br>普通的英文语句中的单词会被断开（
ie
下也是）。

目前主要的问题存在于

长串英文

和

英文单词被断开。其实长串英文就是一个比较长的单词而已。


即英文单词应不应该被断开那？那问题很明显了，显然不应该被断开了。


对于长串英文，就是恶意的东西，自然不用去管了。但是，也要想些办法，不让它把容器撑大。


用：
overflow:auto; ie
下，长串会自动折行。
ff
下，长串会被遮盖。


所以，综上，最好的方式是
word-
wrap:break- word;
overflow:hidden;
而不是