在小程序开发过程中,经常会遇到一些数据无法在text中完全展示,所以会使用到隐藏相关文字,并在后方加上省略号(...)。那么怎么展示呢?
/* 单行隐藏字数,超出按照省略号 */ overflow: hidden; white-space: nowrap; text-overflow:ellipsis;
display:-webkit-box; word-break: break-all; -webkit-box-orient:vertical; /*子元素排列 vertical(竖排)*/ -webkit-line-clamp:5; /*设置显示的多少行。*/ overflow: hidden; text-overflow:ellipsis;
例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了。
上一篇:微信小程序之购物车功能