在处理一段文字的展示的时候发现一个问题，设置white-space:normal;文字内容超出div长度时仍然不会自动换行，改成word-wrap:break-word;才可以，又试了一下发现white-space:normal;其实也会换行，但是我用 11111111111111.... 测试是不会换行的，因为是长数字，总结一下white-space、word-wrap和word-break区别的区别。
- White-space
white-space，规定如何处理元素中的空白和遇到边界如何换行。属于CSS1，兼容性好，所有浏览器都支持。\
white-space: normal | pre | nowrap | pre-wrap | pre-line | inherit ;
- normal: 默认。合并空白符。多个空格和换行合并为一个空格。中文或单词遇到空格会自动换行，没有空格直接超出边界。
- pre: 保留空白符，类似
标签。内容过长将会超出边界。
- nowrap: 合并空白符。文本不会换行，直到遇到
标签。 - pre-wrap: 保留空白符，遇到边界自动换行。
- pre-line: 合并空白符，遇到边界自动换行。
- inherit : 从父元素继承。
- Word-wrap word-wrap ，允许对长的不可分割的单词进行分割并换行。属于CSS3 ，所有主流浏览器支持。 都是合并空白符。 word-wrap: normal | break-word ;
- normal: 默认。遇到中文、整个的单词结束会换行。乱打的字母和数字不会换行，直接超出边界。存在这种行为的关键在于它识别了空格。
- break-word: 在长单词或 URL 地址内部进行换行。遇到边界就进行换行。
- Word-break word-break，规定非中日韩文本的换行规则。属于CSS3 ，所有主流浏览器支持。都是合并空白符。 word-break: normal | break-all | keep-all ;
-
normal: 默认。使用浏览器默认的换行规则。
-
break-all: 允许在单词内换行。遇到边界单词会被切断。
-
keep-all: 只能在半角空格或连字符处换行。
