多行溢出显示省略号（...）

单行溢出显示省略号

多行溢出显示省略号

这里也顺便写一下单行溢出。作为简单复习吧

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100px;

多行溢出。如果是移动端的话。可以这样写

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

如果不考虑兼容问题，这样在pc端写还是可以的。但是不考虑兼容那只是我们作为前端的一个白日梦而已

那么如果考虑兼容要怎么写呢。恩恩，不好写。那就用js写吧。

<script type="text/javascript">
$(".act-com").each(function(){
var maxwidth=104;
if($(this).text().length>maxwidth){
$(this).text($(this).text().substring(0,maxwidth));
$(this).html($(this).html()+'...');
}
});
</script>

这样来通过限制字数来起到显示省略号的作用，这样做就稍稍麻烦点点的是字数是固定的。但是这样就可以不用考虑兼容问题。这个方法算是比较靠谱的写法了