本文共 611 字，大约阅读时间需要 2 分钟。

   
    css实现超出部分显示省略号，控制文字css实现超出部分显示省略号，控制文字
   

/* 显示一行，省略号 */    .content{        width:200px;        white-space: nowrap;        text-overflow: ellipsis;        overflow: hidden;        word-break: break-all;    }/* 显示两行，省略号 */ .content{    width:200px;    text-overflow: -o-ellipsis-lastline;    overflow: hidden;    text-overflow: ellipsis;    display: -webkit-box;    -webkit-line-clamp: 2;    line-clamp: 2;    -webkit-box-orient: vertical;}

-webkit-line-clamp用来限制在一个块元素显示的文本的行数。 为了实现该效果，它需要组合其他的WebKit属性。常见结合属性：

display: -webkit-box; 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。

-webkit-box-orient 必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。

转载地址：http://ynesi.baihongyu.com/