css - 省略号效果

单行文本省略号

white-space: nowrap;     /*强制不换行*/
overflow: hidden;        /*超出部分隐藏*/
text-overflow: ellipsis; /*超出部分显示省略号*/

多行文本省略号(webkit浏览器和移动端适用)

display: -webkit-box;
-webkit-box-orient: vertical; /*子元素排列方式-竖排*/
-webkit-line-clamp: 3;        /*非标准属性 webkit扩展属性 限定只显示3行,多出部分隐藏并显示省略号*/
overflow: hidden;             /*超出部分隐藏*/

以上!