一，单行省略号

width: 100px;    
overflow: hidden;    
text-overflow: ellipsis;    
white-space: nowrap;

二，多行省略号

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

多行省略号主要是-webkit-line-clamp属性，-webkit-line-clamp: 2，表示最多显示两行文本

三，div宽度不固定显示省略号

<div class="title"></div>

.title {
  overflow: hidden;    
  text-overflow: ellipsis;    
  white-space: nowrap;
}

需要注意，宽度不固定时必须是块级元素，或者元素的display属性设置为block