html文本自动换行

word-wrap：

word-wrap的项有：

normal：默认，单词太长会超出容器宽度

break-word: 自动进行单词内断行，文本内容会在边界换行，长单词会断开换行。

把word-wrap配置成break-word后，有长单词的状况下，样式会好不少，不会出现超出容器宽度的问题，可是会发现浏览器在一个长单词在当前行放不下时，会先进行换行，后进行断词，这样会致使上面一行后面会空出一些，以下图：

这里this is 后面会空出不少，要解决这个问题，须要用到css3里面的word-break属性

word-break:

normal:使用浏览器默认的换行规则

break-all:容许单词内换行

keep-all:只能在半角空格或连字符处换行

将word-break设置成break-all后，以下：

能够看到this is后面的空白被补上了，因此用word-break不会作单词过长总体单词换行的处理。