微信小程序-图片宽100%显示,不变形
来源:互联网 发布:端口触发填写 编辑:程序博客网 时间:2024/06/18 05:28
按照HTML习惯进行写,代码:
<view class="meiti"> <image src="http://10.0.0.171:9001/images/2017/0619/20170619115150713_progressive.jpg" style="width:100%;"></image> </view>
效果如下:
很明显变形了
然后查找资料
找到一篇关于微信小程序 图片的信息
http://caibaojian.com/wxapp-image-responsive.html
在图片上加上 mode=”widthFix”
代码如下:
<view class="meiti" style="background-color:red;"> <image src="http://10.0.0.171:9001/images/2017/0619/20170619110943813_progressive.jpg" mode="widthFix" style="width:100%;background-color:black;" ></image> </view>
效果:
这样就能达到我们的要求了,等比例缩放。
如果觉得好您就支持下
阅读全文
0 0
- 微信小程序-图片宽100%显示,不变形
- 图片显示不变形
- ImageView显示图片不变形
- CSS 图片居中显示不变形,显示图片中间部分
- 微信小程序--swiper图片显示不完整
- 图片不变形,按照等比例缩小或扩大显示
- 图片拉伸不变形
- ImageView图片不变形
- 固定控件大小时,为了图片显示不变形,使用Glide显示图片中间部分
- 微信小程序开发关于地图图片显示不出问题
- iOS 图片拉伸不变形
- iOS 图片不变形拉伸
- android 自定义属性,分享一个自适应容器,多用于显示图片,保证图片不变形
- 小程序的swiper不显示图片
- 小程序图片不显示问题解决
- CSS -- 图片宫格不变形显示
- 微信小程序图片显示
- Flash在网页中100%显示并且不变形
- jsp的response.sendRedirect()与request.getRequestDispatcher()关于路径跳转的问题
- 01. 升级系统固件 ❀ FortiManager
- npm-install
- Mac Sublime Text 3 配置汉化、主题、插件等功能
- VS开启语法检查功能(VAssist情况下)
- 微信小程序-图片宽100%显示,不变形
- 垃圾收集器与内存分配策略
- fdisk -l显示信息详解
- 【Java并发】
- Qt学习03——QVariant类
- mysql 查询优化笔记
- C#复选框全选按钮制作
- 设计模式之单例模式
- 自旋锁、排队自旋锁、MCS锁、CLH锁