您的当前位置：首页使用CSS3文本换行的方法介绍
使用CSS3文本换行的方法介绍
时间：2020-11-27
来源：智榕旅游
一、
目前可被主流支持的：
text-overflow 主要解决文本溢出，
取值：clip[ 默认值 ] | ellipsis | string(仅支持Firefox)
配合 white-space : nowrap ; overflow : hidden 使用
二、
word-wrap
取值：normal [ 默认值 ] | break-word
--长单词换行
word-break
取值：normal [ 默认值 ] | break-all | keep-all
--非CJK（"中日韩"）脚本的断行规则
潜规则——默认情况下（不写任何样式情况下的显示规则）：
①单词末尾放不下：另起一行，
②长单词过长且字母连续：不折断
③长单词过长且带破折号：保守折断
重点：下述常用的三种样式针对上述3种潜规则进行改进的区别
word-wrap：break-word 长单词过长且字母连续：吻合折断
[ 改② 潜规则 ①③不变]
word-break：keep-all 长单词过长且带破折号：不折断
[ 改③ 潜规则 ①②不变]
word-break：break-all 单词末尾放不下 ：吻合折断
长单词过长且字母连续：吻合折断
长单词过长且带破折号：吻合折断
[最强：潜规则 ①②③全部改变]
保守折断是按一定格式折断，吻合折断是不留任何边界空白的折断