css超出以省略号形式显示

单行超出省略号

.box {
    width: 141px; // 必须
    height: 60px; 
    font-size: 22px;
    line-height: 1.3;
    overflow: hidden; // 必须
    text-overflow: ellipsis; // 必须
    white-space: nowrap; // 必须，文字换行
}

多行超出省略号

.box {
    width: 141px; // 必须
 height: 60px; // 必须
  color: rgba(0, 0, 0, 0.85);
            font-size: 22px;
            line-height: 1.3;
            overflow: hidden; // 必须
            text-overflow: ellipsis; // 必须
            white-space: nowrap; // 必须，文字换行

            display:-webkit-box; //作为弹性伸缩盒子模型显示。
            -webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
            -webkit-line-clamp:2; // 显示两行
            word-break: break-word; // 词语打断
            white-space: normal; // 正常样式
}