微信小程序 mode 的几种模式
mode 有效值:
mode 有 13 种模式,其中 4 种是缩放模式,9 种是裁剪模式。
模式 值 说明
缩放 scaleToFill 不保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素
缩放 aspectFit 保持纵横比缩放图片,使图片的长边能完全显示出来。也就是说,可以完整地将图片显示出来。
缩放 aspectFill 保持纵横比缩放图片,只保证图片的短边能完全显示出来。也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取。
缩放 widthFix 宽度不变,高度自动变化,保持原图宽高比不变
裁剪 top 不缩放图片,只显示图片的顶部区域
裁剪 bottom 不缩放图片,只显示图片的底部区域
裁剪 center 不缩放图片,只显示图片的中间区域
裁剪 left 不缩放图片,只显示图片的左边区域
裁剪 right 不缩放图片,只显示图片的右边区域
裁剪 top left 不缩放图片,只显示图片的左上边区域
裁剪 top right 不缩放图片,只显示图片的右上边区域
裁剪 bottom left 不缩放图片,只显示图片的左下边区域
裁剪 bottom right 不缩放图片,只显示图片的右下边区域
微信小程序 mode 的几种模式的更多相关文章
- 微信小程序animation动画2种方法
这里介绍 2 种方法一种是常规的小程序方法操作,另一种是引入动画库 1. 常规动画操作设置 wxml: <view> <view bindtap="clickMe" ...
- 微信小程序开发——文本框种输入手机号,点击获取验证码无反应的处理方法
异常描述: 如下图,输入手机号码之后,点击右侧的获取验证码,在开发工具是OK的,真机测试无反应: 页面编码跟H5差不多的,H5没出现这个问题,但是小程序就不一样了. 异常分析: 页面结构层面,为了方便 ...
- 微信小程序 - 开发工具之编译模式
在开发中,遇到一个层级较深的页面,每次都要点击好多步才能调试,也比较闹心,有了自定义编译模式,就方便很多了 点击红圈处, 选择 "+添加编译模式" , 默认的, 启动页面会填入当前 ...
- 微信小程序常用的3种弹窗
1. 表示操作成功,文字上方会显示一个表示操作成功的图标. wx.showToast({ title: '操作成功!', icon: 'success', duration: 1500 // 提示窗停 ...
- 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...
- 微信小程序开发框架技术选型
目前微信小程序开发有三种方式,原生微信小程序,使用mpVue或wepy微信小程序开发框架. 三种开发方式横向对比资料如下:
- 微信小程序 View:flex 布局
微信小程序 View 支持两种布局方式:Block 和 Flex 所有 View 默认都是 block 要使用 flex 布局的话需要显式的声明: display:flex; 下面就来介绍下微信小程序 ...
- 微信小程序入门篇
微信小程序入门篇: 准备工作 IDE搭建 就不多说了,没有内测码去下载个破解版吧,我用了一下,学习完全够了!IDE破解版+安装教程 图片发自简书App 知识准备 JavaScrip还是要看看的,推荐教 ...
- 微信小程序—setTimeOut定时器的坑
原文地址: http://fanjiajia.cn/2018/06/27/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F%E2%80%94setTimeOu ...
随机推荐
- Flask – SQLAlchemy成员增加
目录 简介 结构 展示 技术 运行 代码 创建数据库表单 views视图 home主页 添加成员addnew.html 展示页show_all 简介 结构 $ tree -I "__pyca ...
- map.(parseInt)方法详解
偶然间碰到这样一个问题: ["1","2", "3"].map(parseInt) //[ 1, NaN, NaN ] 运行结果 [ 1, ...
- 火狐下button标签子元素无法点击
button下元素点击事件:在chrome和safari下每个a标签可以点击,在火狐下a标签无法点击. <button> <a href="javascript:;&quo ...
- FileIntputStream / FileOutputStream 类
FileInputStream类(重点) (1)基本概念 java.io.FileInputStream类用于读取诸如图像之类的原始字节流. (2)常用的方法 FileInputStrea ...
- epiinfo是美国CDC开发维护的流行病学数据录入和分析软件,在DOS时代占主流,随着Windows的普及用的人越来越少了,epiinfo重新开发Windows版本后,体积庞大且不好用。在数据录入方面已被EpiData取代,不过epiinfo的分析模块,比如地理信息系统某些情况下还是挺有用的。
Manual: https://www.cdc.gov/epiinfo/support/userguide.html https://en.wikipedia.org/wiki/Epi_Info 教程 ...
- Java中时间和日期的处理
一.日期转换为字符串 1.日期以特定的格式输出: // 创建日期并转换为yyyy-MM-dd格式_(MM一定要大写,以免与hh:mm:ss中的mm冲突) SimpleDateFormat sdf = ...
- 设置脚本sh
- SQLServer —— 流程控制语句
一.IF - ELSE 语法: IF(条件) BEGIN 语句1 语句2 ... END ELSE BEGIN 语句1 语句2 ... END 说明: ELSE是可选部分,如果有多条语句,才需要BEG ...
- Leetcode821.Shortest Distance to a Character字符的最短距离
给定一个字符串 S 和一个字符 C.返回一个代表字符串 S 中每个字符到字符串 S 中的字符 C 的最短距离的数组. 示例 1: 输入: S = "loveleetcode", C ...
- 2015全球商业地产商影响力排行TOP10:中国占据5个
2015全球商业地产商影响力排行TOP10:中国占据5个 1.西蒙丨依然最有影响力 发展概况:西蒙公司是北美商业地产(专题阅读)的王者,美最大商业地产REITS,1960年最初只以开发为主,1993年 ...