CSS如何设置多行超出显示省略号
Issue 欢迎在 Gtihub Issue 中回答此问题: Issue 531 (opens in a new tab)
Author 回答者: shfshanyue (opens in a new tab)
使用 -webkit-line-clamp 来设置多行超出显示省略号
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;Author 回答者: VaCameos (opens in a new tab)
.box {
width: 200px;
word-wrap: break-word;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}先设置宽度 加上word-wrap属性达到换行的目的
利用-webkit-line-clamp限制行数
利用overflow属性隐藏所省略