uniapp css 超过一行显示省略号

咸瑜

于 2023-03-10 20:24:00 发布

阅读量132

点赞数

文章标签： css uni-app 前端 javascript html

本文链接：https://blog.csdn.net/m0_46268961/article/details/132974154

版权

/**
 * 定义公共样式的地方
 */


/**
 * 1行 不换行 显示 ...
 */
.line-clamp{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/**
 * 0. 最多显示1行
 */
.line-clamp-1{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1;
}

/**
 * 1. 最多显示2行
 */

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

拿去用吧哈哈哈哈哈哈哈哈哈呵呵呵呵呵呵哦哦哦哦哦