文本换行的三个属性
- 三属性分别为word-wrap、word-break、white-space.
浏览器默认换行方式
- 对于西文来说,以空格为间隔,每行容纳尽量多的单词,若整行无空格且超出浏览器显示边缘,则横向撑开浏览器边缘,并不换行
- 对于中文来说,则不论是否有空格,无法撑开浏览器边缘,到浏览器边缘则自动换行
接着我们来讨论word-wrap
- word-wrap: normal/break-word;
- normal 即浏览器默认
- break-word 中文与默认同效,西文为每行容纳尽量多的单词,若整行无空格且超出浏览器边缘,则在边缘处强制换行
接着是break-word
- break-word: normal/break-all/keep-all;
- normal 即浏览器默认
- break-all 中文与默认同效,西文为每行容纳尽量多的字符,浏览器边缘处强制换行
- keep-all 中文以标点符号或空格为间隔,可将间隔符间的字符串视为字符串块,每行容纳尽量多的字符串块。西文与浏览器默认同效。
最后white-space
- white-space: normal/nowrap;
- normal 即浏览器默认
- nowrap 不论中文西文,不论是否有标点或空格,若文本过长,则横向撑开浏览器边缘