单行省略
// 单行出现省略号
.text-line {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
多行省略
// 多行省略号,就是想在多少行后再出现省略号就使用如下样式
.line {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
//数字2表示超出两行省略
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
内容来自掘金:移动端H5网页开发常见问题汇总 - 掘金