0

CSS 多行溢出显示省略号

pandora created at6 years ago view count: 2457

下面的代码只会对当行文本才有效。怎样对多行就行设置?

div{
text-overflow: ellipsis;
overflow: hidden;
width:120px;
white-space: nowrap;
}
report
回复
0
div{
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;//设置显示的文本的行数
    -webkit-box-orient: vertical; 
}

纯CSS实现。

6 years ago 回复
0

纯CSS只能在webkit 内核浏览器才能使用。JavaScript解决方案见

https://github.com/FrDH/jQuery.dotdotdot

6 years ago 回复