今天在开发中，测试提出一个bug，超出盒子的宽度文字没有自动换行，当时我在自测的时候只考虑到了中文，忽略了英文，数字以及一些特殊字符。我们知道，中文超出盒子的宽度会自动换行，内容的高度撑起盒子的高度
image.png
但是如果是英文或者数字，特殊符号就会出现超出盒子边框的情况
image.png
然后我见网上给出俩个方法：
- word-wrap：break-word
- word-break : break-all
这俩种方法都能使英文数自动换行。这里我主要想说的是俩者的区别：
word-wrap：break-word以单词为单位换行，如果有个字符串足够长，空余的空间不能容下这个串，就会自动换到下一行。所以，缺点也很明显，前一行会留很大的空白
image.png
word-break : break-all就能很好的解决上边的问题。它不管你字符串有多长，只要超出盒子的宽度就会强制性的自动换行。缺点就是，会把一个完整的字符串（英语单词）截成上下俩部分
image.png
