多行文字截断方法

在只针对 PC 端开发的年代，可以通过后端控制输出文字的长度来实现固定行数的效果。
但在响应式页面，这可能不再适用，只能输出足够多的文字，然后通过前端截取需要的行数。
Webkit 内核的浏览器可以通过 -webkit-line-clamp 私有属性实现多行文字截取。其他浏览器没有这个属性，我的做法通常是把容器的高度限定为 行高 * 显示的行数，超出的部分隐藏，勉强达到目的。

.line-clamp {
  overflow:hidden;
  text-overflow:ellipsis;
  display:0;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

对于其他内核的浏览器，就是限制高度

line-clamp(@lines,@line-height: 1.3em) {
  text-overflow:ellipsis;
  display:0;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:@lines;
  overflow:hidden;
  line-height:@line-height;
  max-height:@line-height * @lines;
}