css截断单行文本的方法

发布时间:2020-01-11编辑:脚本学堂
当单行文本过长而影响布局时,通常会考虑截取文本的一部分进行显示,并且在其末尾显示省略号。

css中实现这种文本截断的效果,可配合使用white-spaceoverflowtext-overflow属性。
下面是一个示例:

width: 135px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
-moz-text-overflow: ellipsis; 
-webkit-text-overflow: ellipsis;