微信小程序超出省略号

在做自己的一个小程序,查了很久，在小程序中超出省略号不起作用，这样写就可以了。

效果

单行文本超出

width: 500rpx;
display:-webkit-box;
-webkit-line-clamp:1;
overflow:hidden;
text-overflow:ellipsis;
-webkit-box-orient:vertical;
word-break:break-all;

多行文本超出

display: -webkit-box;  /*设置为弹性盒子*/
-webkit-line-clamp: 5;  /*最多显示5行*/
overflow: hidden;  /*超出隐藏*/
text-overflow: ellipsis;  /*超出显示为省略号*/
-webkit-box-orient: vertical;
word-break: break-all;  /*强制英文单词自动换行*/

【注】单行文本只是比多行文本多加了一个宽度

word-break: break-word; 并不能解决所有的自动换行
使用word-break: break-all;完美解决