强制不换行

针对一行超出用省略号表示

<p>这里有很多内容,很多很多,显示不完</p>
p{font-size:20px;line-height:40px;overflow:hidden;white-space:nowarp;text-overflow:ellipsis;width:200px;}

显示结果

这里有很多内容,很多...

超出两行用省略号表示

<p>这里有很多内容,很多很多,显示不完这里有很多内容,很多很多,显示不完这里有很多内容,很多很多,显示不完</p>
p{font-size:20px;line-height:40px;width:400px;}
$(document).ready(function(){
  t=$('p:eq(0)');
if(t.height()>80){
  t.height(80);
  t.css({overflow:'hidden'});
  t.text(t.text().substring(0,t.html().length-8));
  t.html(t.html()+'....');
}
})

同样想要多行省略也是一样,只需后面标签高端改变即可

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容