widthFix 宽度不变,高度自适应

在设置图片中,有种模式 mode="widthFix", 可以使图片在宽度不变,高度自动变化,保持原图的宽高比例,即设置图片的宽度而高度自适应.

但在实际的应用中会产生两个问题:

1. 图片在初始加载时,会瞬间竖直拉伸变形闪烁后马上恢复正常宽高
   解决办法: height: auto;

2. 多个图片时,图片中间会有空白间隙如图:
   

   WeChatba512d60bd998525c3300448a25ac412.jpg
   原因: inLine-block 水平呈现的元素, 换行显示时会有间距
   解决办法:
   直接外层包一层 flex 布局即可解决

{
display: flex;
flex-direction:column;
}