微信小程序限制文本单行和多行显示省略号

最新推荐文章于 2024-07-12 11:50:53 发布

Mr_Tony

最新推荐文章于 2024-07-12 11:50:53 发布

阅读量2.4k

点赞数 1

分类专栏：前端

本文链接：https://blog.csdn.net/Mr_Tony/article/details/88779825

版权

前端专栏收录该内容

39 篇文章 1 订阅

订阅专栏

1、限制多行显示省略号：

#itemChatContent {
  width: 80%;
  margin-top: 10rpx;
  font-size: 30rpx;
  //以下是关键
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

2、限制单行

#itemChatContent {
  width: 80%;
  margin-top: 10rpx;
  font-size: 30rpx;
    //以下是关键
    overflow: hidden;
    white-space: nowrap;
    text-overflow:ellipsis;
}