如何实现指定多少行后内容未显示完就用省略号...代替？

Question

1）已知文字父级元素div的高度，比如500px；
2）已知字体大小：font-size:28px;
如何算出需要显示多少行？
知道多少行后，如何实现指定这些行后内容未显示完就用省略号...代替？

Answer 1

.xxx {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 20px;
  max-height: 60px;
}

Answer 2

限制最大显示行数 超过了不就用...代替了`!

Answer 3

多少行是多少行……1行的话css控制不难，更多不清楚

Answer 4

传送门 http://stackoverflow.com/questions/3922739/limit-text-length-to-n-line...

Answer 5

没有多少行，只有高度，当内容超出指定的高度了，就用js截断~

Answer 6

行数是不能控制的，使用高度代替，估摸着你的行数。

Answer 7

关于文字内容溢出用点点点(…)省略号表示

Answer 8

用jquery插件jquery.dotdotdot.js解决

Answer 9

js控制最大显示字数个数，截取后面加"..."
$(".xxx").each(function(){

var maxWidth=56;
if($(this).text().length>maxWidth){
    $(this).text($(this).text().substring(0,maxWidth));
    $(this).html($(this).html()+'…');
}

});