css 实现单行、多行文本溢出省略号显示

CSS实现：

单行实现：

// css部分
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;

white-space:设置如何处理元素内的空白；值为nowrap：文本不会换行，文本会在同一行上继续，直到遇到<br>标签为止。

效果如下：

多行实现：

// css部分
display: -webkit-box;    
-webkit-box-orient: vertical;    
-webkit-line-clamp: 3;    
overflow: hidden;

缺点：不兼容IE

display: -webkit-box 将对象作为弹性伸缩盒子模型显示

-webkit-box-orient 设置伸缩对象的子元素的排列方式；vertical：从上向下垂直排列子元素。

-webkit-line-clamp 限制一个块元素显示的文本的行数

效果如下：