css多行文本溢出显示省略号，部分文字隐藏不掉

困扰了很久的一个问题，css多行文本溢出显示省略号，部分文字隐藏不掉，今天找到了解决方法，做下记录。

方法

css多行文本溢出显示省略号

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

问题

手机上出现部分文字没隐藏的问题
效果如下图：

解决方案

增加下面的代码解决这个问题，给定高度和行高。

word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
line-height: 20px;
height: 40px;/* 2行隐藏就两倍，三行隐藏就三倍*/

效果如下：

希望给和我一样有遇到这个问题的人带来帮助。