CSS实现单行、多行文本溢出显示省略号（…）

单行

.p1 {
    display: inline-block;
    width: calc(100vw - 90px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

多行

.p2{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

calc() 函数用于动态计算长度值

width: -webkit-calc(100% - 100px);
width: -moz-calc(100% - 100px);
width: calc(100% - 100px);