小程序单行显示和多行显示

（一）效果显示

1.单行显示，溢出...：

.text {
    display: block;
    width: 100%;
    font-size: 60rpx;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

2.多行显示，溢出...

.mul-text {
    width: 100%;
    font-size: 60rpx;
    color: #222;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 100rpx;
}

（二）关键属性

单行： white-space: nowrap; overflow: hidden; text-overflow: ellipsis;

多行： -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden;

详细解释见文档描述： 微信小程序CSS属性支持