文字溢出处理方案 :

1首先 , 强制文本在一行中显示 ;

white-space: nowrap;

2然后 , 隐藏文本的超出部分 ;

overflow: hidden;

3最后 , 使用省略号代替文本超出部分 ;

text-overflow: ellipsis;

 

white-space 样式 用于设置 文本显示方式 :

默认方式 : 显示多行 ;

white-space: normal;

显示一行 : 强行将盒子中的文本显示在一行中 ;

white-space: nowrap;

text-overflow 样式 用于设置 文字溢出处理方案 :

默认方式 - 简单裁切 : 不显示 ... 省略号 ;

text-overflow : clip;

显示省略号 : 文本溢出时 , 显示 ... 内容 ;

text-overflow : ellipsis;