文本换行：word-break、word-wrap、white-space

1、word-wrap:允许长单词或者URL地址换行到下一行

.box{
    word-wrap:normal;      /*-默认值,只在允许的断字点换行，有时会超出容器宽度-*/
    word-wrap:break-word;  /*-在长单词或URL地址内部进行换行-*/
}

（注：是否允许浏览器在单词内换行）

2、word-break:规定自动换行的处理方法

.box{
    word-break:normal;    /*-默认值,使用浏览器默认的换行规则-*/
    word-break:break-all; /*-允许在单词内换行-*/
    word-break:keep-all;  /*-只能在半角空格或连字符处换行-*/
}

3、white-space:如何处理元素内的空白

.box{
    white-space:normal;   /*-默认值,空白会被浏览器忽略-*/
    white-space:pre;      /*-空白会被浏览器保留,类似于
标签-*/
    white-space:nowrap;   /*-文本不换行,知道遇到
为止-*/
    white-space:pre-wrap; /*-保留空白符序列,正常换行-*/
    white-space:pre-line; /*-合并空白序列,但保留换行符-*/
    white-space:inherit;  /*-继承-*/
}