手机端多行文本结尾省略号方法

我们知道，单行文本结尾使用省略号的办法是：

<pre name="code" class="css">.box{    text-overfolw: ellipsis;    white-space: nowrap;    overflow: hidden;}

那么，我们不仅要两行，三行，甚至更多文本信息显示，同时要让超出范围的文本用省略号的方式该怎么办呢？

chrome提供了一个clamp的属性，当然，此属性目前仅限于在chrome下使用。但是，对于手机端网站来说，绝大多数都是基于chrome，所以使用这一属性就不成问题了。

方法如下：

.box{width: 150px;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;      //控制几行几行结束位置显示省略号-webkit-box-orient: vertical;}

</pre><pre name="code" class="css">效果如图所示：