微信小程序开发——单行文本溢出显示省略号

/*多行文本溢出省略号显示*/
.text-deal{
  overflow : hidden;/*溢出部分隐藏*/
  text-overflow: ellipsis;/*text-overflow属性规定了当文本溢出包含元素时所发生的事情，溢出部分用省略号显示*/
  display: -webkit-box; /*常见结合属性：display: -webkit-box; 必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。*/
  -webkit-line-clamp: 3;/* -webkit-line-clamp用来限制在一个块元素显示的文本的行数。需要组合display: -webkit-box;*/
  -webkit-box-orient: vertical;/*-webkit-box-orient设置或检索伸缩盒对象的子元素的排列方式。需要组合display: -webkit-box;*/
  word-break: break-all; /* 暴力强制换行，不管行末的单词是否显示完整，只要是非中日韩字符，就强制换行； */
}
/*-webkit-line-clamp为3，代表三行后超出隐藏加省略，常用为1。*/
/*注意：-webkit-line-clamp是webkit的私有属性，是一个 不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中*/

/*单行文本溢出省略号显示*/
  overflow:hidden; /*溢出部分隐藏*/
  text-overflow:ellipsis; /*text-overflow属性规定了当文本溢出包含元素时所发生的事情，溢出部分用省略号显示*/
  white-space:nowrap; /*不会自动换行，除非手动添加换行标签*/