不设置word-warp和word-break的时候，一行单词，超过了容器的宽度是，会将最后一个单词下移一行进行显示，如果下移的那个单词长度还是超过了容器宽度，则会溢出
word-wrap
设置word-wrap: break-word时，先把长单词移动到下一行，然后如果还是超出容器宽度，则进行单词内的断句换行
后面的单词同上述规则
word-break
当上述情况，长单词移动到下一行的时候，第一行会有一定空余的空间，较为浪费资源。
于是通过设置word-break: break-all，长单词不移动到下一行，直接在当前行进行断句换行
white-space
作用于空格和回车，用于控制空格是否合并、回车是否可折行、句子太长是否在空格处折行
常用取值不同的作用：
- normal: 默认。空白会被浏览器忽略。
- pre: 空白会被浏览器保留。其行为方式类似 HTML 中的
<pre>标签。 - nowrap: 文本不会换行，文本会在在同一行上继续，直到遇到
<br>标签为止。 - pre-wrap: 保留空白符序列，但是正常地进行换行。
- pre-line: 合并空白符序列，但是保留换行符。
- inherit: 规定应该从父元素继承 white-space 属性的值。
参考文章
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。