微信小程序 解决 view 文字 过多 溢出的问题,超过行数后隐藏显示省略号

多行文本

.note_item text {
    display: -webkit-box;
    font-size: 28rpx;
    color: #000000;
    line-height: 40rpx;
    word-break: break-all;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

单行文本

.note2_item text {
    display: block;
    font-size: 28rpx;
    color: #000000;
    line-height: 40rpx;
    height: 120rpx;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

tip:必须要有宽度

原文地址:https://www.cnblogs.com/anyw3c/p/11596968.html

时间: 2024-10-07 19:45:01

微信小程序 解决 view 文字 过多 溢出的问题,超过行数后隐藏显示省略号的相关文章

微信小程序将view动态填满全屏

一.在app.js利用官方方法获取设备信息 App({ onLaunch: function() { wx.getSystemInfo({ success: res => { this.globalData.systemInfo = res } }) }, globalData: { systemInfo: null } }) 获取到的windowWidth.windowHeight等度量单位为 px 二.在要使用的页面的js文件里将单位统一为rpx const app = getApp() P

微信小程序-解决下拉刷新报错

关于"enablePullDownRefresh": "true" 一.使用方式 在 Page 中定义 onPullDownRefresh 处理函数,监听该页面用户下拉刷新事件.需要在 config 的window选项中开启 enablePullDownRefresh.当处理完数据刷新后,wx.stopPullDownRefresh可以停止当前页面的下拉刷新. 二.错误处理 在代码中出现的报错如下: 变量值"true",这是个字符串而不是Bool

微信小程序的view标签中text如何居中?

display:flex; align-items:center; justify-content:center; 原文地址:https://www.cnblogs.com/lsyy2017/p/11128497.html

微信小程序动态显示标签文字或者按钮文字

wxml: <van-tag round size="medium" type="{{item.type?'danger':'primary'}}">{{item.type?'失物招领':'寻物启事'}}</van-tag> js: listDatas: [ { type: 1, name: '充电宝', desc: '行云二楼', time: '9月20日 12:35' }, { type: 0, name: '黑色天堂伞', desc:

微信小程序解决存在图片太大而有效显示区域较小--阿里云oss产生缩略图

OSS是使用通过URL尾部的参数指定图片的缩放大小 图片路径后面拼接如下路径:     ?x-oss-process=image/[处理类型],x_100,y_50[宽高等参数] ?x-oss-process=image/resize,m_fill,h_高度,w_宽度,limit_0 //去除之前的参数,添加新的参数resp.list.map( item => { item.logo = item.logo.replace(/\?([0-9a-zA-Z/=_-]+)/g,'?x-oss-proc

教你怎么用微信小程序进行文字识别

如果我们想要摘录书本上的文字,其实不一定非要手动打录或者拿笔来摘抄.我们也可以用手机 来进行文字识别,快速的将你想要的文字给识别提取出来,还能节省时间.那我们如何用手机来 进行文字识别呢,最简单的方法还是用微信小程序,无需下载任何APP,点击进去就能使用,下面 小编就来教大家如何用微信小程序来进行文字识别 . 1.首先,我们打开手机微信,点击微信上的搜索框搜索"迅捷文字识别",找到这个小程序,然后点击 进去,进入小程序的界面之后,我们先点击"照片/拍照 ". 2.然

微信小程序--图片相关问题合辑

图片上传相关文章 微信小程序多张图片上传功能 微信小程序开发(二)图片上传 微信小程序上传一或多张图片 微信小程序实现选择图片九宫格带预览 ETL:微信小程序之图片上传 微信小程序wx.previewImage预览图片 微信小程序之预览图片 小程序开发:上传图片到腾讯云 .NET开发微信小程序-上传图片到服务器 微信小程序本地图片处理--按屏幕尺寸插入图片 [微信小程序]上传图片到阿里云OSS Python Flask小程序文件(图片)上传技巧 小程序图片上传阿里OSS使用方法 微信小程序问题汇

1万字!彻底看懂微信小程序

Q:为什么说小程序如炮友? A:小程序刚发布不久就流行一个段子:APP如原配,一年不用几次:服务号如情人,一个月固定几次:订阅号如酒店小卡片,天天可以卖广告:小程序像炮友,用完就走. 资本如嫖客,各个平台和垂直类掠夺者已经瓜分掉了线上流量,那么未来争夺的流量战场必然在实体场景,很多巨头其实已经证明了线下流量庞大的潜力.在快递包裹上印上自己的二维码关注公众号形成二次寄出快递的粘性,PokemonGo让用户在实体地图上捕获小精灵. 未来的入口不限于二维码,而是一切的富媒体.二维码之于2D识别,复杂图

微信小程序自定义组件的使用以及调用自定义组件中的方法

在写小程序的时候,有时候页面的内容过多,逻辑比较复杂,如果全部都写在一个页面的话,会比较繁杂,代码可读性比较差,也不易于后期代码维护,这时候可以把里面某部分功能抽出来,单独封装为一个组件,也就是通常说的自定义组件,自定义组件类似于页面,它有wxml 模版.wxss 样式和js文件,然后在页面中使用该自定义组件即可. 例如,我的自定义组件代码结构是这样的: myComponent文件就是我所创的自定义组件,myComponent.wxml文件代码为: <view class="inner&q