小程序文本限制行数其实是比较简单的,只要指定最大高度,然后overflow隐藏一下,但由于我之前为了去空格,加了个white-space:nowwrap,导致换行一直失败,也就是说怎么着都在一行里面,去掉就好了
小程序文字限定行数换行就这几行:
CSS代码
- .break{
- overflow: hidden;
- word-break: break-all;
- text-overflow: ellipsis; //...显示
- display: -webkit-box; //盒型
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 2; //2行,这个最好配合一下元素的max-height和font-size,多试两下就OK了。
- }
轻松搞定。
参考:
1、https://developer.mozilla.org/zh-CN/docs/Web/CSS/white-space,white-space CSS 属性是用来设置如何处理元素中的 空白