单行
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
多行
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
.box{
width: 100px;
height: 100px;
background-color: #fff;
overflow: hidden;/* 溢出隐藏 /
line-height: 20px;/ 设置行高与容器高度成倍数关系/
text-align: justify;/ 设置文本对齐方式为两端对齐/
position: relative;/ 子绝父相，这里是为了给伪元素设置定位/
}
/ 因为省略号是放在文本最后面的，所以使用伪元素after /
.box::after{
content: "...";/ 省略号是放在文本最后面的 /
width: 20px;/ 是为了遮盖的时候正好遮盖中原来的一个字的大小/
background-color: #fff;/ 与父元素相同的背景颜色/
position: absolute;/设置定位，其位置就是文本的右下角 */
right: 0;bottom: 0;
}
