多行文本溢出顯示省略號兼容寫法
阿新 • • 發佈：2018-09-27
splay posit over overflow 省略號 lips nbsp dde 顯示
1.如果只考慮webkit內核瀏覽器
.mult_line_ellipsis{
overflow: hidden;
text-overflow:ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
2.兼容火狐和谷歌
.imitate_ellipsis{
position:relative;
line-height:1.4em;
height:2.8em;
overflow:hidden;
}
.imitate_ellipsis::after{
content:"...";
position:absolute;
}
3.兼容ie
.imitate_ellipsis{
position:relative;
line-height:1.4em;
height:2.8em;
overflow:hidden;
}
.imitate_ellipsis:after{
content:"...";
position:absolute;
}
多行文本溢出顯示省略號兼容寫法