文本溢出时显示省略号

显示单行

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

显示多行

display: -webkit-box;
-webkit-box-orient: vertical;
/* 此处为在第2行末尾显示省略号 */
-webkit-line-clamp: 2;
 word-wrap: break-word;
 word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;

注意：若父元素设置了display: flex;那么也应给该父元素添加overflow: hidden;属性才能生效