实现溢出变省略号的方法

标签：last   ace   ext   box   lin   rap   ellipsis   line   display   

第一种（单行文本）

 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 

要使用

 white-space: nowrap; 

尽量别使用<nobr></nobr>标签 可能会导致不兼容的情况发生

第二种（多行文本）

 text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; 

只需把2改成想要显示的行数 即可达到效果。

实现溢出变省略号的方法

标签：last   ace   ext   box   lin   rap   ellipsis   line   display   

原文地址：https://www.cnblogs.com/yyc1998/p/12084332.html