您现在的位置是:博客首页 > 网站开发 > 微信开发 > 微信开发

微信小程序Text限定行数

程序员之路2020-06-04个人博客人已围观

简介想实现小程序中组件text最多显示两行内容,如果超出就省略号 .desc { /*定义为自适应布局*/ display : -webkit-box ; word-break : break-all ; /*超出文字用省略号代替*/ text-overflow : ellipsis ; /*竖直方向的超出

想实现小程序中组件text最多显示两行内容,如果超出就省略号

.desc {
  /*定义为自适应布局*/
  display: -webkit-box;
  word-break: break-all;

   /*超出文字用省略号代替*/
  text-overflow: ellipsis;

  /*竖直方向的超出和隐藏*/
  -webkit-box-orient: vertical;

  /*设定行数为2*/
  -webkit-line-clamp: 2;

  /*多出部分隐藏*/
  overflow: hidden;
}


 
和css中的定义基本相同         如果小程序CSS文字溢出,显示有问题,可以试试 line-height 比如:line-height:45rpx

很赞哦! ()

站点信息

  • 建站时间:2019-05-13
  • 网站程序:魔豆CMS7.5
  • 博客名称:程序员之路
  • 文章统计:96 篇
  • 源码统计:6 篇
  • 访问统计
  • 微信公众号:扫描二维码,关注我们
  • 微信公众号