单行文本省略

在html+css中，当咱们遇到诸如商品详情的标题的输入时，咱们会须要使用到：

单行文本溢出省略

核心css语句：

一、overflow:hidden;  （顾名思义超出限定的宽度就隐藏内容）

二、white-space: nowrap; （设置文字在一行显示不能换行）

三、text-overflow: ellipsis;（规定当文本溢出时显示省略符号来表明被修剪的文本）

多行文本溢出省略

核心css语句：

一、-webkit-line-clamp:2; （用来限制在一个块元素显示的文本的行数,2表示最多显示2行。 为了实现该效果，它须要组合其余的WebKit属性）

二、display: -webkit-box; （和1结合使用，将对象做为弹性伸缩盒子模型显示 ）

三、-webkit-box-orient:vertical;（ 和1结合使用 ，设置或检索伸缩盒对象的子元素的排列方式 。）

四、overflow:hidden;  （顾名思义超出限定的宽度就隐藏内容）

五、text-overflow: ellipsis;（规定当文本溢出时显示省略符号来表明被修剪的文本）

 

当编写小程序时，当咱们遇到单行文本溢出时，和html+css编辑同样：

可是，不能为flex布局，当布局为flex布局时，文本溢出无效

布局应为

　　display:inline-flex