祗疼妳一个 发表于 7 天前

小程序在 skyline 下如何开启多行省略

参考:https://developers.weixin.qq.com/community/develop/doc/000a648baacca06e83f1034d66c000
媒介

小程序在 skyline 下不支持 line-clamp,想要开启多行省略使用 text 组件的 max-lines 结合 overflow 属性。
解决办法:skyline 下不支持 line-clamp,可以使用 text 组件的 max-lines 结合 overflow 属性使用。
拓展:
1. 内联文本只能用 text 组件,不能用 view,如 <text> foo <text>bar</text> </text>
2. 新增 span 组件用于内联文本和图片,如 <span> <image> </image> <text>bar</text> </span>
资料地址

https://developers.weixin.qq.com/miniprogram/dev/component/text.html
https://i-blog.csdnimg.cn/direct/c214043405a54a4cac0fad5e26bbefab.png
实例

<view class="product-info">
……
<text class="product-desc" overflow="ellipsis" max-lines="{{2}}">xxxxxxxxxx</text>
……
</view>
.product-desc {
font-size: 24rpx;
color: #666;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
margin-bottom: 15rpx;
}

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 小程序在 skyline 下如何开启多行省略