单行文字显示...
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
多行文字比较复杂...
自己查阅了多种方法,还是没有找到比较完美的解决方法。。
有一个方法的思路比较好玩。
就是在 p 元素的css上加一个伪元素:
展示...
一个比较靠谱的方法是使用js 截取字符串,并且加上“...”。
微信官方模板使用的是
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
Android, iPhone 上的浏览器应改都可以
PC端 chrome, safari, opera 是可以的, firefox 是不可以。