uniappX 移动端单行/多行文字隐藏显示省略号

在手机端不能多行省略使用 -webkit-line-clamp 属性所以移动端多行省略不会生效改为 lines 属性即可

css 复制代码
/**单行文本溢出显示省略号*/
.text-ov1 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  height: auto;
}
/**APP多行文本溢出显示省略号*/
// #ifdef APP-ANDROID
@for $i from 2 through 5 {
  .text-ov#{$i} {
    overflow: hidden;
    text-overflow: ellipsis;
    lines: $i;
    height: auto;
  }
}
// #endif

/**web多行文本溢出显示省略号*/
// #ifdef H5
@for $i from 2 through 5 {
  .text-ov#{$i} {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: $i;
    line-clamp: $i;
    -webkit-box-orient: vertical;
    height: auto;
  }
}
// #endif
相关推荐
悟乙己7 小时前
使用 Python 中的强化学习最大化简单 RAG 性能
开发语言·python·agent·rag·n8n
max5006007 小时前
图像处理:实现多图点重叠效果
开发语言·图像处理·人工智能·python·深度学习·音视频
whysqwhw7 小时前
Hippy 跨平台框架扩展原生自定义组件的完整实现方案对比
前端
dasseinzumtode8 小时前
nestJS 使用ExcelJS 实现数据的excel导出功能
前端·后端·node.js
子兮曰8 小时前
🔥C盘告急!WSL磁盘暴增?三招秒清20GB+空间
前端·windows·docker
Jinuss8 小时前
Vue3源码reactivity响应式篇之EffectScope
前端·vue3
stoneship8 小时前
网页截图API-Npm工具包分享
前端
Jedi Hongbin8 小时前
Three.js shader内置矩阵注入
前端·javascript·three.js
etcix8 小时前
dmenux.c: integrate dmenu project as one file
c语言·前端·算法
RickyWasYoung8 小时前
【代码】matlab-遗传算法工具箱
开发语言·matlab