css如何实现多行省略

单行省略

overflow: hidden;
text-overflow: ellipsis;
white-space: no-wrap;

注意这里的容器是需要宽度的

多行省略

overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;

根据实际情况,修改line-clamp注意只有基于谷歌内核的浏览器才会生效

你可能感兴趣的:(前端开发,css,css3,多行省略,单行省略,css省略号)