css实现单行文本截断和多行文本截断显示省略号

在平时的项目开发中，经常会遇到单行文本超出隐藏显示...或者多行文本超出隐藏显示... ,具体实现的方式如下：

单行文本

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

多行文本

.box{
  		overflow: hidden;
  		display: -webkit-box;
  		-webkit-line-clamp: 5;
  		-webkit-box-orient: vertical;
  	}

可根据项目的需要 给元素添加一个宽度。 其中-webkit-line-clamp: 5;中的这个数字是可以修改的，根据我们的项目具体需求来调整即可。