一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现:
1 div { // 单行 2 white-space: nowrap; 3 overflow: hidden; 4 text-overflow: ellipsis; 5 }
1 div { // 多行 2 overflow: hidden; 3 text-overflow: ellipsis; 4 display: -webkit-box; // 注意不是flex 5 -webkit-line-clamp: 2; // 指定行数 6 -webkit-box-orient: vertical; // box元素排列水平方式 7 }