微信小程序标签cover-image,在未设置宽高的情况下,在手机上不显示,但是在微信web开发者工具上却显示。
如果我们想使图片宽高比保持一致,是图片不变形,解决方法:
在cover-image标签外放一个父容器给它设置相对定位,子元素设置绝对定位,宽,高。
<cover-view class="img-wrap">
<cover-image class="img" src="/pages/web/images/dialog.png"/>
</cover-view>
.img-wrap {
position: relative;
width: 100%;
padding-top: 42.3333%;
}
.img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
问题解决!