微信小程序实现文字显示超出多少行自动省略（含代码）

最新推荐文章于 2024-04-29 19:16:47 发布

小秃僧

最新推荐文章于 2024-04-29 19:16:47 发布

阅读量234

点赞数 3

文章标签：微信小程序小程序

本文链接：https://blog.csdn.net/weixin_43420127/article/details/136666612

版权

本文介绍了如何在微信小程序中，通过WXML和WXSS的CSS样式，实现文本内容超出指定行数后自动省略并显示省略号的功能，提供详细的代码示例。

摘要由CSDN通过智能技术生成

支持自定义超出多少行自动省略

实现效果图：

wxml：

<view class="cardtext">文字内容</view>

wxss：

.cardtext{
  overflow: hidden;/*超出文本隐藏*/
  text-overflow:ellipsis; /*超出部分省略号显示 */
  display: -webkit-box;/*弹性盒模型*/
  -webkit-box-orient: vertical;/*上下垂直*/
  -webkit-line-clamp: 2;/*自定义行数*/
  font-size: small;/*字体大小*/
}

end