概述
问题
使用image标签时发现图片尺寸比较大的时候,设置宽度高度会导致图片被宽高挤压变形;
方案
小程序为例:
使用view标签或div标签代替image,设定展示宽高使用背景图方式;
设置css样式
<view class="goods-img" style="background-image: url({{item.goodsMainImage}});"></view>
. goods-img{
width: 100%;
height: 345rpx;
border-radius: 20rpx 20rpx 0 0;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
最后
以上就是俭朴人生为你收集整理的image标签设置宽度导致图片被压缩变形的全部内容,希望文章能够帮你解决image标签设置宽度导致图片被压缩变形所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复