- 单行文本
.text{ 100px;//宽度要定义好 overflow: hidden;//溢出隐藏 text-overflow: ellipsis;//显示省略符号来代表被修剪的文本。 white-space: nowrap;//文字不换行 }
- 多行文本
.text-more{ 100px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;//必须结合的属性,将对象作为弹性伸缩盒子模型显示 -webkit-line-clamp:2;//控制文本的行数 -webkit-box-orient:vertical;//必须结合的属性,设置或检索伸缩盒对象的子元素的排列方式 }