小程序的小bug（五）--------------------处理文字过长显示省略号的问题

首先 话不多说 ,上图

通常我们在处理文字长度的时候处理一行变成省略号还是比较简单的.此处不赘述,多行的时候有点无从下手可以用css3的方法

上代码

.course-name {

font-size: 30 rpx;

word-break: break-all;//允许在单词内换行

text-align: left;

color: #323232;

line-height: 45 rpx;

text-overflow: -o-ellipsis-lastline;//css3中webkit内核提供的一个方法类似 ellipsis

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;//自适应盒子

-webkit-line-clamp: 1;//此处为1行,如果是两行就改成2

-webkit-box-orient: vertical;

}

详情请看此博客

注:此处方法仅使用小程序 ,如果是web端,尤其是用webpack构建的时候可能存在其他问题.