vue中css文字溢出处理

要展示的文字一般是后端给的，不敢相信后端能给出啥东西，所以日常记录一波，文字处理！

height: 100px ; /* 固定高度*/
overflow: hidden; /* 溢出隐藏*/
white-space: wrap;  /* 换行*/
text-overflow: ellipsis; /* 超出变成省略号*/
-webkit-line-clamp: 4; /* 限制在一个块元素显示的文本的行数 */
display: -webkit-box;
-webkit-box-orient: vertical;
 word-break: break-all; 

在html里面绑定 title属性 鼠标移上去就有提示了

<span :title="text"> {{ text }} </span>

可能不是很好看，可以改成tooltip 包上去 ui库加持