前端 - 微信如何保证拿到的用户头像图片是正方形？

问题描述

问 题

之前制作页面以为微信传过来的图片都是正方形的(做出圆形头像的效果)？
但是今天通过接口 获取的一个头像图片得到的是一个638x496，就变成了椭圆的...
很奇怪，微信上传头像不是都要剪切成正方形的吗？为什么会出现这样的尺寸

得到的用户头像地址：
http://wx.qlogo.cn/mmopen/xDf...

<div class="img-responsive"><img src="..." /><div>

.img-responsive{
  width:20%;
  border-radius:50%;
}
.img-responsive img{
  width:100%;
  display:block;
}

解决方案

今天也碰到类似情况了，套个div勒一下就好，把border-radius加到img外层的div上，记得overflow:hidden，这时img加个定宽/定高，让高度/宽度自适就好。

这篇关于前端 - 微信如何保证拿到的用户头像图片是正方形？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！