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; /*-空白会被浏览器保留,类似于<pre>标签-*/
white-space:nowrap; /*-文本不换行,知道遇到<br>为止-*/
white-space:pre-wrap; /*-保留空白符序列,正常换行-*/
white-space:pre-line; /*-合并空白序列,但保留换行符-*/
white-space:inherit; /*-继承-*/
}