微信小程序文字超过行后隐藏并且显示省略号

单行超出字数隐藏显示省略号 

  /* 单行隐藏字数,超出按照省略号 */
  display: block;
  width:144px;
  height: 60rpx;
  line-height: 40rpx;
  overflow: hidden;
  white-space: nowrap;
  text-overflow:ellipsis;

多行：

display:-webkit-box;
font-size:28rpx;
color:#000000;
line-height: 40rpx;
word-break: break-all;   
-webkit-box-orient:vertical;  /*子元素排列 vertical（竖排）*/
-webkit-line-clamp:5;    /*设置显示的多少行。*/
overflow: hidden;
text-overflow:ellipsis;

 

word-break:break-all;

例如div宽200px，它的内容就会到200px自动换行，如果该行末端有个英文单词很长（congratulation等），它会把单词截断，变成该行末端为conra(congratulation的前端部分)，下一行为tulation（conguatulation）的后端部分了。