小程序image图片自适应，不压缩，不变形，原图填充

第一种方法

使用image做背景图，宽设100%，使用mode属性下的widthfix。

mode值	说明
scaleToFill	（默认值）缩放形式，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素
aspectFit	缩放模式，保持纵横比缩放图片，使图片的短边能完全显示出来。也就是说，可以完整的将图片显示出来
aspectFill	缩放模式，保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。
widthFix	缩放模式，宽度不变，高度自动变化，保持原图宽高比不变。
hightFix	缩放模式，高度不变，宽度自动变化，保持原图宽高比不变。

//mode="widthFix"这个属性 就可以自适应了。
<image src="{{model.picurl}}" class="img" mode="widthFix"></image>

第二种方法

使用background-image做背景图，给div设置固定高度

  //给这层div添加固定高度，使用background-size: contain;
  position: relative;
  height: 260px;
  background-image: url(imgurl); //imgurl图片地址
  background-size: contain;
  background-position: bottom;
  background-repeat:no-repeat;

第三种方法

小程序使用 rpx也可以自适应。

链接: image的4种缩放模式和9种裁剪模式.