CSS文本溢出显示省略号

CSS文本溢出显示省略号 admin 发布于 CSS 项目中常常有这种需要我们对溢出文本进行"..."显示的操作，单行多行的情况都有，利用html新增属性可以控制网页中单行或者多行显示，达到文字长度控制，防止多文字对样式的影响！

单行：（方法一）

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

单行：（方法二）

 overflow: hidden; 
 text-overflow: ellipsis;
 display: -webkit-box;
 -webkit-line-clamp: 1; 
 -webkit-box-orient: vertical;

多行

  overflow: hidden; 
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; //控制行数
  -webkit-box-orient: vertical;