#yyds干货盘点#CSS实现超出内容省略号显示

1.一行显示，超出显示为省略号

.van-ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

2.两行显示，超出显示为省略号

.van-multi-ellipsis--l2 {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

3.三行显示，超出显示为省略号

.van-multi-ellipsis--l3 {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

4.总结

• 此为前端常用代码块