微信小程序-文字超出限制如何在末尾加省略号
来源:互联网 发布:vod视频提取软件 编辑:程序博客网 时间:2024/04/28 23:31
微信小程序-文字超出限制如何在末尾加省略号
特意为了这一个功能点来记笔记。
当文字超出一行时会自动换行 那如何让文字不自动换行并在末尾加上省略号呢?
我查资料的时候搜到这个博客
http://blog.csdn.net/u010168409/article/details/54429678
原贴的答案是这样的
text { display: -webkit-box; word-break: break-all; text-overflow: ellipsis; white-space: nowrap; font-size: 32rpx; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp:2;}
然后自己试验了一下 发现这样写就可以达到效果了
text{ overflow:hidden; //超出一行文字自动隐藏 text-overflow:ellipsis;//文字隐藏后添加省略号 white-space:nowrap; //强制不换行 }
知识点二 在图片未能正确加载时 显示默认图片
用条件渲染 即wx:if,wx:elif,wx:else系列
eg1. 图片
<block wx:for="{{data}}"><image wx:if="{{item.avatar == ''}}" class="avatar" src="/images/cinema.png"></image> <image wx:else="{{item.avatar}}" class="avatar" src="{{item.avatar}}" background-size="cover"></image></block>
eg2. 文字 text、view标签是同样的效果
<block wx:for="{{data}}"> <view wx:if="{{item.entity_name==null}}" class="label"></view> <view wx:else="{{item.entity_name}}" class="label">{{item.entity_name}}</view></block>
2 0
- 微信小程序-文字超出限制如何在末尾加省略号
- 小程序-文字超出限制
- 小程序-文字超出限制
- CSS限制文字只能显示一行,超出部分显示省略号
- 文字超出显示省略号
- 文字超出显示省略号
- 文字超出变为省略号
- 在IE下如何让超出宽度的文字显示为省略号
- html中文字长度超出宽度如何显示省略号“...”
- 文本超出长度加省略号。。
- css-文字超出显示省略号
- 文字超出隐藏显示省略号
- html文字超出显示省略号
- CSS文字超出显示省略号
- 文字超长加省略号
- 串太长时如何在其末尾显示一个省略号
- css限制显示字数,文字长度超出部分用省略号表示
- css限制显示字数,文字长度超出部分用省略号表示
- 93. Restore IP Addresses
- 一切从今天开始
- 将获取的html源代码格式化输出
- PHP经典面试题目汇总
- Spark sbt-assembly 打包
- 微信小程序-文字超出限制如何在末尾加省略号
- CES展会的技术亮点奠定2017年各个行业的基调
- python基础学习笔记(个人学习时记录的笔记,不全的地方请大家指正)
- 第二次卡
- 欢迎使用CSDN-markdown编辑器
- 二叉树面试题
- 【c++】前言
- 96. Unique Binary Search Trees
- nginx安装配置脚本